素材网 素材网

jQuery制作动画背景图像使用效果

下载资源()次

阅读次数()次

发布时间:2014-05-28

jQuery制作动画背景图像使用效果
分享到:

用法简介:

来源:xw素材网

jQuery制作动画背景图像使用效果。
文件引用:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
		var scrollSpeed = 1; 		// Speed in milliseconds
		var step = 1; 				// How many pixels to move per step
		var current = 0;			// The current pixel row
		var imageWidth = 2247;		// Background image width
		var headerWidth = 1280;		// How wide the header is.
		//The pixel row where to start a new loop
		var restartPosition = -(imageWidth - headerWidth);
		function scrollBg(){
			//Go to next pixel row.
			current -= step;
			//If at the end of the image, then go to the top.
			if (current == restartPosition){
				current = 0;
			}
			//Set the CSS of the header.
			$('#header').css("background-position",current+"px 0");
		}
		//Calls the scrolling function repeatedly
		var init = setInterval("scrollBg()", scrollSpeed);
</script>	


   

相关标签:

网友评论:

评论

发表 剩余字数:20

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家社会集体的和公民的合法权益,不得利用本站制作、复制和传播不法有害信息!

二、互相尊重,对自己的言论和行为负责。

@ 2013 xwcms.net . All Rights Reserved. xw素材网 | 备案号:晋ICP备13005902号 联系管理员
×

邮箱订阅

什么是邮箱订阅?

邮箱订阅是xw素材网为jquery爱好者与web程序员提供一项以邮箱的方式发送最新jquery资源与素材资源的模式,用户只需在左侧填写正确的邮箱用户名与邮箱地址我们将每天推荐最新优质资源到用户邮箱。当然每份邮箱都会有一个取消订阅按钮,当用户点击取消按钮时我们将会停止对用户发送邮箱资源推送。再次感谢大家对xw素材网的支持与关注。