JS模仿腾讯图片站的图片翻页按钮效果完整实例_javascript技巧_脚本之家

www.6766.com ,希望本文所述对大家JavaScript程序设计有所帮助。

本文实例讲述了JS模仿腾讯图片站的图片翻页按钮效果。分享给大家供大家参考,具体如下:

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

  模仿腾讯图片翻页  *{ margin:none; padding:none; } body{ background:#000000; } #tip{ position:absolute; width:564px; height:362px; top:-362px; background:url(../img/TencentImg/tipLayer.png); } #left{ position:absolute; width:101px; height:95px; background:url(../img/TencentImg/left.png); border:1px solid #f2f2f2; display:none; cursor:hand; } #right{ position:absolute; width:101px; height:95px; background:url(../img/TencentImg/right.png); border:1px solid #f2f2f2; display:none; cursor:hand; } #mouseXPosition{ width:30px; height:20px; color:#ffffff; display:inline; } #mouseYPosition{ width:30px; height:20px; color:#ffffff; display:inline; } #divTop{ width:30px; height:20px; color:#ffffff; display:inline; }   function init(){ var ml = document.body.clientWidth/2 - 40; document.getElementById.style.pixelTop = 300; document.getElementById.style.pixelTop = 300; document.getElementById.style.pixelLeft = ml - 101*4; document.getElementById.style.pixelLeft = ml + 101*4; var tip = document.getElementById; var initH = (document.body.clientWidth - tip.offsetWidth)/2; document.getElementById.style.left = initH; document.getElementById.style.pixelTop = -362; } function mousePosition{ if{ return {x:ev.pageX, y:ev.pageY}; } return { x:ev.clientX + document.body.scrollLeft - document.body.clientLeft, y:ev.clientY + document.body.scrollTop - document.body.clientTop }; } document.onmousemove = mouseMove; function mouseMove{ e = e || window.event; var mousePos = mousePosition; var mid = document.body.clientWidth/2; document.getElementById.innerHTML = mousePos.x; document.getElementById.innerHTML = mousePos.y; if{ document.getElementById.style.display = "block"; document.getElementById.style.display = "none"; }else if{ document.getElementById.style.display = "block"; document.getElementById.style.display = "none"; } } function show(){ if(document.getElementById.style.pixelTop < 80){ document.getElementById.style.pixelTop += 20; document.getElementById.innerHTML = document.getElementById.style.pixelTop; setTimeout } } function hide(){ if(document.getElementById.style.pixelTop > -362){ document.getElementById.style.pixelTop -= 20; document.getElementById.innerHTML = document.getElementById.style.pixelTop; setTimeout } }      鼠标 X 轴: 0
 鼠标 Y 轴: 0
 图片上边距: 0 0 

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图