jQuery滚动视频悬浮

来源:https://www.sucaihuo.com/js/1783.html 2017-04-21 16:53浏览(851) 收藏

jQuery滚动视频悬浮,适合于pc网站直接可以拿来使用,app 要有小的修改很容易,文件内都有备注注释可共参考,在文件index.js参数调用.
jQuery滚动视频悬浮
分类:html5 > 视频 难易:初级
查看演示 下载资源 下载积分: 20 积分

首先引用css+jquery

<link rel="stylesheet" href="css/reset.min.css">
<link rel="stylesheet" href="css/style.css">
<script src="jquery/jquery-1.10.2.js"></script>
<script src="js/index.js"></script>

#videoBox大小浮动文字随意调,任何位置大小、多长时间播放。

var ha = ( $('#videoBox').offset().top + $('#videoBox').height() );

$(window).scroll(function(){  

	if ( $(window).scrollTop() > ha + 500 ) { 
    $('#videoBox').css('bottom','0'); 
	} else if ( $(window).scrollTop() < ha + 200) {  
    $('#videoBox').removeClass('out').addClass('in');     
	} else {       
  	$('#videoBox').removeClass('in').addClass('out');   
    $('#videoBox').css('bottom','-500px');             
  };  

});
标签: 视频滚动
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2