资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
javascript实现的在当前窗口中漂浮框的代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style> .div_float img{width:100px;} </style> <body> <!--漂浮框--> <div class="div_float" id="div_float"></div> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3D%22javascript%22%3E%20%0D%0Avar%20oTop%3D0%3B%2F%2F%E5%BD%93%E5%89%8D%E7%AA%97%E5%8F%A3%E7%9A%84%E9%A1%B6%E9%83%A8%20%0D%0Avar%20oBottom%3D0%3B%2F%2F%E5%BD%93%E5%89%8D%E7%AA%97%E5%8F%A3%E7%9A%84%E5%BA%95%E9%83%A8%20%0D%0Afunction%20MyObjectFloatPhotos(_id%2C_title%2C_url%2C_src)%20%7B%20%2F%2F%E8%87%AA%E5%AE%9A%E4%B9%89%E5%AF%B9%E8%B1%A1%EF%BC%8C%E5%85%B7%E4%BD%93%E5%9B%BE%E7%89%87%E4%BF%A1%E6%81%AF%20%0D%0Athis.id%3D_id%3B%20%0D%0Athis.title%3D_title%3B%20%0D%0Athis.url%3D_url%3B%20%0D%0Athis.src%3D_src%3B%20%0D%0A%7D%20%0D%0Afunction%20MyObjectFloatPosition(xon%2Cyon%2CxPos%2CyPos%2C_div%2Cinterval)%20%7B%20%2F%2F%E6%B5%AE%E5%8A%A8%E5%B1%82%E5%AF%B9%E8%B1%A1%20%0D%0Athis.xon%3Dxon%3B%20%0D%0Athis.yon%3Dyon%3B%20%0D%0Athis.xPos%3DxPos%3B%20%0D%0Athis.yPos%3DyPos%3B%20%0D%0Athis.div%3D_div%3B%20%0D%0Athis.interval%3Dinterval%3B%20%2F%2F%E8%AE%B0%E5%BD%95%E9%87%8D%E5%A4%8D%E7%9A%84%E9%94%AE%E7%A0%81%EF%BC%8C%E7%94%A8%E4%BA%8E%E5%8F%96%E6%B6%88%E5%BE%AA%E7%8E%AF%E4%BA%8B%E4%BB%B6%20%0D%0A%7D%20%0D%0Avar%20step%20%3D%201%3B%20%0D%0Avar%20delay%20%3D%2030%3B%20%2F%2F%E5%BE%AA%E7%8E%AF%E9%97%B4%E9%9A%94%20%0D%0Avar%20height%20%3D%200%3B%20%0D%0Avar%20Hoffset%20%3D%200%3B%20%0D%0Avar%20Woffset%20%3D%200%3B%20%0D%0Avar%20pause%20%3D%20true%3B%20%0D%0Afunction%20changePosByID(_id)%20%7B%20%0D%0Afor(var%20i%3D0%3Bi%20%3CarrayMyObjectFloatPhotos.length%3Bi%2B%2B)%20%7B%20%0D%0Aif(_id%3D%3DarrayMyObjectFloatPhotos%5Bi%5D.id)%20%0D%0AchangePosAll(arrayMyObjectFloatPosition%5Bi%5D)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20changePosAll(_myObj)%20%7B%20%2F%2F%E5%85%B7%E4%BD%93%E7%9A%84%E4%BD%8D%E7%BD%AE%E4%BF%AE%E6%94%B9%E6%96%B9%E6%B3%95%20%0D%0Awidth%20%3D%20document.body.clientWidth%3B%20%0D%0Aheight%20%3D%20document.body.clientHeight%3B%20%0D%0AHoffset%20%3D%20_myObj.div.offsetHeight%3B%20%0D%0AWoffset%20%3D%20_myObj.div.offsetWidth%3B%20%0D%0A_myObj.div.style.visibility%20%3D%20%22visible%22%3B%20%0D%0A_myObj.div.style.left%20%3D%20_myObj.xPos%20%2B%20document.body.scrollLeft%3B%20%0D%0A_myObj.div.style.top%20%3D%20_myObj.yPos%20%2B%20document.body.scrollTop%3B%20%0D%0Aif%20(_myObj.yon)%20%7B%20%0D%0A_myObj.yPos%20%3D%20_myObj.yPos%20%2B%20step%3B%20%0D%0A%7D%20%0D%0Aelse%20%7B%20%0D%0A_myObj.yPos%20%3D%20_myObj.yPos%20-%20step%3B%20%0D%0A%7D%20%0D%0A%2F*%E5%BD%93%E5%89%8D%E7%AA%97%E5%8F%A3%E4%B8%AD%E9%A3%98%E5%8A%A8*%2F%20%0D%0Aif%20(_myObj.yPos%20%3C%20oTop)%20%7B%20%0D%0A_myObj.yon%20%3D%201%3B%20%0D%0A_myObj.yPos%20%3D%20oTop%3B%20%0D%0A%7D%20%0D%0Aif%20(_myObj.yPos%20%3E%3D%20(oBottom%20-%20Hoffset))%20%7B%20%0D%0A_myObj.yon%20%3D%200%3B%20%0D%0A_myObj.yPos%20%3D%20(oBottom%20-%20Hoffset)%3B%20%0D%0A%7D%20%0D%0A%2F*%E5%BD%93%E5%89%8D%E7%AA%97%E5%8F%A3%E4%B8%AD%E9%A3%98%E5%8A%A8*%2F%20%0D%0Aif%20(_myObj.xon)%20%7B%20%0D%0A_myObj.xPos%20%3D%20_myObj.xPos%20%2B%20step%3B%20%0D%0A%7D%20%0D%0Aelse%20%7B%20%0D%0A_myObj.xPos%20%3D%20_myObj.xPos%20-%20step%3B%20%0D%0A%7D%20%0D%0Aif%20(_myObj.xPos%20%3C%200)%20%7B%20%0D%0A_myObj.xon%20%3D%201%3B%20%0D%0A_myObj.xPos%20%3D%200%3B%20%0D%0A%7D%20%0D%0Aif%20(_myObj.xPos%20%3E%3D%20(width%20-%20Woffset))%20%7B%20%0D%0A_myObj.xon%20%3D%200%3B%20%0D%0A_myObj.xPos%20%3D%20(width%20-%20Woffset)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20start()%20%7B%20%2F%2F%E6%89%80%E6%9C%89%E6%B5%AE%E5%8A%A8%E5%B1%82%E5%BC%80%E5%A7%8B%E6%BC%82%E6%B5%AE%20%0D%0AcreateFloatDiv()%3B%20%0D%0Afor(var%20i%3D0%3Bi%20%3CarrayMyObjectFloatPosition.length%3Bi%2B%2B)%20%7B%20%0D%0Amy_setInterval(arrayMyObjectFloatPosition%5Bi%5D.div)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20my_float_div_hid(hiddivid)%7B%20%2F%2F%E9%9A%90%E8%97%8F%E6%96%B9%E6%B3%95%20%0D%0Adocument.getElementById(hiddivid).style.display%3D'none'%3B%20%0D%0A%7D%20%0D%0Afunction%20my_setInterval(_div)%7B%20%2F%2F%E8%AE%BE%E7%BD%AE%E6%9F%90%E4%B8%AA%E6%B5%AE%E5%8A%A8%E5%B1%82%E5%BE%AA%E7%8E%AF%20%0D%0Afor(var%20i%3D0%3Bi%20%3CarrayMyObjectFloatPosition.length%3Bi%2B%2B)%20%7B%20%0D%0Aif(_div.id%3D%3DarrayMyObjectFloatPosition%5Bi%5D.div.id)%7B%20%0D%0AarrayMyObjectFloatPosition%5Bi%5D.interval%3D%20setInterval('changePos'%2BarrayMyObjectFloatPhotos%5Bi%5D.id%2B'()'%2C%20delay)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20my_clearInterval(_div)%7B%2F%2F%E6%B8%85%E9%99%A4%E6%9F%90%E4%B8%AA%E6%B5%AE%E5%8A%A8%E5%B1%82%E5%BE%AA%E7%8E%AF%20%0D%0Afor(var%20i%3D0%3Bi%20%3CarrayMyObjectFloatPosition.length%3Bi%2B%2B)%20%7B%20%0D%0Aif(_div.id%3D%3DarrayMyObjectFloatPosition%5Bi%5D.div.id)%7B%20%0D%0AclearInterval(arrayMyObjectFloatPosition%5Bi%5D.interval)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Avar%20arrayMyObjectFloatPosition%3D%20new%20Array()%3B%20%0D%0Afunction%20createFloatDiv()%7B%2F%2F%E6%8B%BC%E6%8E%A5%E6%B5%AE%E5%8A%A8%E5%B1%82%E7%9A%84html%20%0D%0Afor(var%20i%3D0%3Bi%20%3CarrayMyObjectFloatPhotos.length%3Bi%2B%2B)%20%7B%20%0D%0Avar%20temp_str%3D''%3B%20%0D%0Atemp_str%2B%3D'%3Cdiv%20id%3D%5C'float_div_'%2BarrayMyObjectFloatPhotos%5Bi%5D.id%20%2B'%5C'%20style%3D%5C'position%3Aabsolute%3B%20left%3A311%3Btop%3A815%3Bvisibility%3Ahidden%3Bvertical-align%3Atop%3B%5C'%20onmouseover%3D%5C'my_clearInterval(this)%3B%5C'%20onmouseout%3D%5C'my_setInterval(this)%3B%5C'align%3D%22right%22%3E'%3B%20%0D%0Atemp_str%2B%3D'%3Cdiv%20style%3D%5C'%2F*position%3Aabsolute%3Btop%3A-2%3Bright%3A-2%3B*%2Fcursor%3Ahand%3Bcolor%3Ared%3Bfont-size%3A12px%3Bfont-weight%3Abold%3Btext-align%3Acenter%3Bborder%3A%237C4707%20solid%200px%3Bbackground-color%3A%23DBE4F9%3Bpadding-top%3A2px%3B%5C'%20onclick%3Dmy_float_div_hid(%5C'float_div_'%2BarrayMyObjectFloatPhotos%5Bi%5D.id%20%2B'%5C')%20title%3D%5C'%E5%85%B3%E9%97%AD%E7%AA%97%E5%8F%A3%5C'%3E%E5%85%B3%E9%97%AD%3C%2Fdiv%3E'%3B%20%0D%0Atemp_str%2B%3D'%3Cdiv%3E%3Ca%20href%3D%5C''%2BarrayMyObjectFloatPhotos%5Bi%5D.url%2B'%5C'%20title%3D%5C''%2BarrayMyObjectFloatPhotos%5Bi%5D.title%20%2B'%5C'%20target%3D%5C'_blank%5C'%3E%3Cimg%20border%3D%5C'0%5C'%20src%3D%5C''%2BarrayMyObjectFloatPhotos%5Bi%5D.src%20%2B'%5C'%20alt%3D%22%22%20%2F%3E%3C%2Fa%3E%3C%2Fdiv%3E'%3B%20%0D%0Atemp_str%2B%3D'%3C%2Fdiv%3E'%3B%20%0D%0Adocument.getElementById('div_float').innerHTML%20%3D%20document.getElementById('div_float').innerHTML%2Btemp_str%3B%20%0D%0A%7D%20%0D%0Afor(var%20i%3D0%3Bi%20%3CarrayMyObjectFloatPhotos.length%3Bi%2B%2B)%20%7B%20%0D%0Avar%20_left%3D0%3B%20%0D%0Aif(i%3D%3D0)_left%3D20%3B%20%0D%0Aelse%20_left%20%3D%20document.body.clientWidth%2F(arrayMyObjectFloatPhotos.length-1)*i%3B%20%0D%0Avar%20_MyObjectFloatPosition%3Dnew%20MyObjectFloatPosition(0%2C0%2C_left%2Cdocument.body.clientHeight%2Cdocument.getElementById('float_div_'%2BarrayMyObjectFloatPhotos%5Bi%5D.id)%2Cnull)%3B%20%0D%0AarrayMyObjectFloatPosition.push(_MyObjectFloatPosition)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%2F*%E4%BB%A5%E4%B8%8B%E4%BB%A3%E7%A0%81%E4%B8%BB%E8%A6%81%E6%98%AF%E8%AE%BE%E7%BD%AE%E8%A6%81%E6%9C%89%E5%87%A0%E4%B8%AA%E6%B5%AE%E5%8A%A8%E6%A1%86*%2F%20%0D%0Atry%20%0D%0A%7B%20%0D%0Avar%20arrayMyObjectFloatPhotos%3D%20new%20Array()%3B%20%0D%0Avar%20_MyObjectFloatPhotos%3Dnew%20MyObjectFloatPhotos(''%2C''%2C''%2C'')%3B%20%0D%0A_MyObjectFloatPhotos%3Dnew%20MyObjectFloatPhotos('75229'%2C'%E8%BF%8E%E4%B8%96%E5%8D%9A'%2C'%23'%2C'%2Fupload%2F2010-3%2F20100315203532753.gif%26%238217%3B)%3B%20%0D%0AarrayMyObjectFloatPhotos.push(_MyObjectFloatPhotos)%3B%20%0D%0Afunction%20changePos75229()%20%7BchangePosByID('75229')%3B%7D%20%0D%0A_MyObjectFloatPhotos%3Dnew%20MyObjectFloatPhotos('75230'%2C'%E8%BF%8E%E4%B8%96%E5%8D%9A'%2C'%23'%2C'%2Fupload%2F2010-3%2F20100315203532753.gif')%3B%20%0D%0AarrayMyObjectFloatPhotos.push(_MyObjectFloatPhotos)%3B%20%2F%2F%E5%88%9B%E5%BB%BA%E6%96%B0%E7%9A%84%E6%B5%AE%E5%8A%A8%E5%B1%82%E5%AE%9E%E4%BD%93%EF%BC%8C%E5%B9%B6%E6%94%BE%E5%85%A5%E6%95%B0%E7%BB%84%20%0D%0Afunction%20changePos75230()%20%7BchangePosByID('75230')%3B%7D%20%2F%2F%E6%9C%AA%E4%BA%86%E4%BD%BF%E6%B5%AE%E5%8A%A8%E6%A1%86%E4%B8%8D%E7%9B%B8%E4%BA%92%E5%BD%B1%E5%93%8D%EF%BC%8C%E5%BF%85%E9%A1%BB%E8%AE%BE%E5%AE%9A%E4%B8%8D%E5%90%8C%E7%9A%84%20interval%20%E5%80%BC%20%0D%0Astart()%3B%20%2F%2F%E5%BC%80%E5%A7%8B%E6%89%A7%E8%A1%8C%20%0D%0A%7D%20%0D%0Acatch(err)%20%0D%0A%7B%7D%20%0D%0Avar%20Sys%20%3D%20%7B%7D%3B%20%2F%2F%E4%BB%A5%E4%B8%8B%E4%BB%A3%E7%A0%81%E6%98%AF%E5%88%A4%E6%96%AD%E5%9C%A8%E7%81%AB%E7%8B%90%E4%B8%AD%E5%B0%86%E5%85%B6%E9%9A%90%E8%97%8F%EF%BC%8C%E8%BF%98%E6%9C%89%E4%BA%9B%E9%97%AE%E9%A2%98%EF%BC%8C%E8%AF%B4%E6%98%AF%E4%B8%8D%E7%AC%A6%E5%90%88%E8%A7%84%E8%8C%83%E4%BD%86%E6%88%91%E5%A7%8B%E7%BB%88%E6%89%BE%E4%B8%8D%E5%87%BA%20%0D%0Avar%20ua%20%3D%20navigator.userAgent.toLowerCase()%3B%20%0D%0Aif%20(document.getBoxObjectFor)%7B%20%0D%0ASys.firefox%20%3D%20ua.match(%2Ffirefox%5C%2F(%5B%5Cd.%5D%2B)%2F)%5B1%5D%20%0D%0Aif(Sys.firefox)%7B%20%0D%0Adocument.getElementById('div_float').style.display%3D'none'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> <!--漂浮框--> <div id="div_absmiddle" style="background:red;padding-right: 10px; margin-top: -75px; padding-left: 10px; left: 0px; padding-bottom: 10px; width: 75px; line-height: 20px; padding-top: 10px; position: fixed; top: 50%; height: 150px"> </div><!--该div是绝对居中的--> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%0D%0Avar%20delay%20%3D%2030%3B%20%2F%2F%E5%BE%AA%E7%8E%AF%E9%97%B4%E9%9A%94%20%0D%0AsetInterval('disPosition()'%2C%20delay)%3B%20%2F%2F%E4%BB%A5%E4%B8%8B%E5%87%BD%E6%95%B0%E4%B8%BA%E8%8E%B7%E5%BE%97%E5%BD%93%E5%89%8D%E7%AA%97%E5%8F%A3%E7%9A%84%E5%8F%AF%E8%A7%81%E9%AB%98%E5%BA%A6%20%0D%0Afunction%20disPosition()%7B%20%0D%0AoTop%3Ddocument.documentElement.scrollTop%3B%20%0D%0AoBottom%3Ddiv_absmiddle.offsetTop*2%20%2B%20div_absmiddle.offsetHeight%20-%2020%20%2B%20document.documentElement.scrollTop%3B%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程