定点悬浮flv播放视频窗口个浏览器兼容js/css实现

需要jquery包

html

<DIV id="divimgbox" style="clear:both;HEIGHT: 210px;WIDTH: 258px;z-index:999;position:fixed!important;position:absolute;overflow:hidden;">
<div id="popping">
<div class="tips" >本视屏受理热线:88783838</div><a id="close" href="javascript:;">×关闭</a>
<div class="content">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="258" height="217">
<param name="movie" value="http://shop.tzinfo.net/flvplayer.swf" />
<param name="quality" value="high" />
<param name="allowFullScreen" value="true" />
<param name="FlashVars" value="file=http://www.0576tz.cn/uploads/media/01.flv&autostart=true&repeat=true&shuffle=false&displaywidth=258" />
<embed src="http://shop.tzinfo.net/flvplayer.swf" allowfullscreen="true" flashvars="file=http://www.0576tz.cn/uploads/media/01.flv&autostart=true&repeat=true&shuffle=false&displaywidth=258" quality="high" allowfullscreen=true pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="258" height="217"></embed>
</object>
</div>
</div>
</DIV>
<SCRIPT type="text/javascript" src="{dede:global.cfg_templets_skin/}/js/admovejs.js"></SCRIPT>


admovejs.js

var windowW= document.documentElement.clientWidth;
var windowH= document.documentElement.clientHeight;
//偏移量
var moveX= ((windowW - 960)/2)+8;
var divW = parseInt(document.getElementById("divimgbox").style.width);
var divH = parseInt(document.getElementById("divimgbox").style.height);
//alert(windowW+"#"+divW+"#"+"#"+windowH+"#"+divH);
//$("#close").html(windowW+"#"+divW+"#"+windowH+"#"+divH);
//var xPos = 825;
//var yPos = 540; 
var xPos = windowW - divW - moveX;
var yPos = windowH - divH - 25;
var step = 0;
var delay = 20; 
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
var img1 =document.getElementById("divimgbox");
img1.style.left = (xPos+ $(document).scrollLeft())+"px";
img1.style.top = (yPos+ $(document).scrollTop())+"px";
var Sys = {};
var ua = navigator.userAgent.toLowerCase();
var s;(s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] :(s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :(s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] :(s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[1] :(s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[1] : 0; 
 //以下进行测试
if (Sys.ie) {
  if (Sys.ie=='6.0') {
	$(window).scroll( function() {
	xPos=xPos-8;
	img1.style.left = (xPos+ $(document).scrollLeft())+"px";
	img1.style.top = (yPos+ $(document).scrollTop())+"px";
	});
	}
}
 //if (Sys.firefox) alert('Firefox: ' + Sys.firefox);
 //if (Sys.chrome) alert('Chrome: ' + Sys.chrome);
 //if (Sys.opera) alert('Opera: ' + Sys.opera);
 //if (Sys.safari) alert('Safari: ' + Sys.safari);
$("#close").click(function(){
$("div").remove("#divimgbox");
});
$("#popping .content").mouseover(function(){
	$("#divimgbox").animate({height: "230px"}, 200);
});
$("#popping .content").mouseout(function(){
	$("#divimgbox").animate({height: "210px"}, 200);
});


自动适应浏览器窗口大小定位

ie6 采用滚动条触发事件定位。

其他浏览器fixed 定位

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值