JS 實現(xiàn)Div向上浮動的實現(xiàn)代碼
更新時間：2012年10月11日 23:10:53 作者：
用js實現(xiàn)的可以讓div慢慢上升效果實現(xiàn)代碼，喜歡的朋友可以參考下
Html 及 JS 代碼如下：
<div id="newsOne" onmouseover="CleartTimeInterVal();" onmouseout="resetInterVal();"
style="position: absolute; width: 100px;">
<a href="http://m.fzitv.net" target="_blank">腳本之家</a>
</div>
<script type='text/javascript'>
var newsOne = document.getElementById("newsOne");
newsOne.style.bottom = 0;
newsOne.style.left = window.screen.availWidth - 100;
var bottom = 0;
function newsScroll() {
if (bottom > (window.screen.availHeight - window.screenTop)) {
bottom = 0;
newsOne.style.bottom = 0;
}
else {
bottom = bottom + 15;
newsOne.style.bottom = bottom;
}
}
var timeid = setInterval(newsScroll, 300);
function CleartTimeInterVal() {
clearInterval(timeid);
}
function resetInterVal() {
timeid = setInterval(newsScroll, 300);
}
</script>
在線運行：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
復(fù)制代碼 代碼如下:
<div id="newsOne" onmouseover="CleartTimeInterVal();" onmouseout="resetInterVal();"
style="position: absolute; width: 100px;">
<a href="http://m.fzitv.net" target="_blank">腳本之家</a>
</div>
<script type='text/javascript'>
var newsOne = document.getElementById("newsOne");
newsOne.style.bottom = 0;
newsOne.style.left = window.screen.availWidth - 100;
var bottom = 0;
function newsScroll() {
if (bottom > (window.screen.availHeight - window.screenTop)) {
bottom = 0;
newsOne.style.bottom = 0;
}
else {
bottom = bottom + 15;
newsOne.style.bottom = bottom;
}
}
var timeid = setInterval(newsScroll, 300);
function CleartTimeInterVal() {
clearInterval(timeid);
}
function resetInterVal() {
timeid = setInterval(newsScroll, 300);
}
</script>
在線運行：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關(guān)文章
javascript設(shè)置連續(xù)兩次點擊按鈕時間間隔的方法
這篇文章主要介紹了javascript設(shè)置連續(xù)兩次點擊按鈕時間間隔的方法,是非常實用的技巧,需要的朋友可以參考下2014-10-10
p5.js 是一個JavaScript的函數(shù)庫，它在制作之初就和Processing有同樣的目標(biāo)。本文將利用p5.js 制作出一束動態(tài)花束，感興趣的可以嘗試一下2022-06-06
這篇文章主要為大家詳細介紹了聊一聊JS中this的指向問題，幫助大家輕松了解JS中this的指向，感興趣的小伙伴們可以參考一下2016-06-06
用JavaScript來美化HTML的select標(biāo)簽的下拉列表效果
這篇文章主要介紹了用JavaScript來美化HTML的select標(biāo)簽的下拉列表效果的方法,而且在多瀏覽器下的兼容效果也得到提升,需要的朋友可以參考下2015-11-11
工作中常用的js、jquery自定義擴展函數(shù)代碼片段匯總
本文主要對工作中常用的js、jquery自定義擴展函數(shù)代碼片段進行了分享，具有很好的參考價值，需要的朋友一起來看下吧2016-12-12
使用wxapp-img-loader自定義組件實現(xiàn)微信小程序圖片預(yù)加載功能
由于微信小程序沒有提供類似 Image 這樣的 JS 對象，要實現(xiàn)圖片的預(yù)加載要麻煩一些，wxapp-img-loader自定義組件可以在微信小程序中實現(xiàn)圖片預(yù)加載功能,需要的朋友可以參考下2018-10-10
JavaScript中Array數(shù)組常用方法(附上相應(yīng)的用法及示例)
這篇文章主要給大家介紹了關(guān)于JavaScript中Array數(shù)組常用方法,文中附上相應(yīng)的用法及示例,需要的朋友可以參考下2024-01-01
在?TypeScript?中，映射類型可以幫助我們避免編寫重復(fù)的代碼，它可以根據(jù)現(xiàn)有類型和定義的一些規(guī)則來創(chuàng)建新類型。本文我們就來看一下什么是映射類型以及如何構(gòu)建自己的映射類型2022-08-08
JS分割字符串并放入數(shù)組的函數(shù)，需要的朋友可以參考下。2011-07-07
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)頁面浮動導(dǎo)航，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-01-01