1、backstretch:一款背景插件,可以为任意元素添加动态调整大小、幻灯片式的背景图片。

2、引入方式

 

<script type="text/javascript" src="//cdn.bootcss.com/jquery-backstretch/2.0.4/jquery.backstretch.min.js"></script>

3、参数:

 

   

$.fn.backstretch = function (images, options) 
// images:图片路径的字符串或字符串数组;
//options.duration不同图片之间切换时长
//options.fade淡出时长
//option.speed淡出速度

   

 

 

3、使用方式:

<script type="text/javascript">
			$.backstretch(
				["framework/image/bg1.jpg",
				 "framework/image/bg2.jpg",
				 "framework/image/bg3.jpg",	
				],{
				fade:750,duration:4000,speed:500
			});
			$("#btn1").click(function(e){
				e.preventDefault();
				$("#rd").backstretch("framework/image/bg4.jpg");
			});
			$("#btn2").click(function(e){
				e.preventDefault();
				$("#rd").backstretch("framework/image/bg5.jpg");
			});
			
		</script>

4、效果图

 

 
背景插件之backstretch
 

相关文章:

  • 2022-12-23
  • 2021-06-27
  • 2021-08-31
  • 2021-09-11
  • 2021-09-26
  • 2021-10-09
  • 2022-12-23
  • 2021-09-09
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-07-27
  • 2022-12-23
  • 2021-08-29
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案