JS實(shí)現(xiàn)雙擊屏幕滾動(dòng)效果代碼
更新時(shí)間：2015年10月28日 10:54:47 作者：企鵝
這篇文章主要介紹了JS實(shí)現(xiàn)雙擊屏幕滾動(dòng)效果代碼,涉及JavaScript鼠標(biāo)事件的響應(yīng)及頁面元素屬性的動(dòng)態(tài)變換技巧,需要的朋友可以參考下
本文實(shí)例講述了JS實(shí)現(xiàn)雙擊屏幕滾動(dòng)效果代碼。分享給大家供大家參考，具體如下：
這里演示雙擊滾屏效果代碼的實(shí)現(xiàn)方法，不知道有覺得有用處的沒，現(xiàn)在網(wǎng)上還有很多還在用這個(gè)特效的呢，代碼分享給大家吧。
運(yùn)行效果截圖如下：
在線演示地址如下：
http://demo.jb51.net/js/2015/js-db-click-src-scroll-style-codes/
具體代碼如下：
<html>
<SCRIPT language=JavaScript>
var currentpos,timer;
function initialize()
{
timer=setInterval("scrollwindow()",10);
}
function sc(){
clearInterval(timer);
}
function scrollwindow()
{
currentpos=document.body.scrollTop;
window.scroll(0,++currentpos);
if (currentpos != document.body.scrollTop)
sc();
}
document.onmousedown=sc
document.ondblclick=initialize
</script>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>雙擊滾屏</title>
<style>
<!--
body { color: #FFFFFF; font-family: Verdana; font-size: 9pt }
-->
</style>
</head>
<body bgcolor="#0496DC">
<p align="center">請雙擊</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
</body>
</html>
希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- js實(shí)現(xiàn)隨屏幕滾動(dòng)的帶緩沖效果的右下角廣告代碼
- JS實(shí)現(xiàn)的N多簡單無縫滾動(dòng)代碼(包含圖文效果)
- JS實(shí)現(xiàn)的新浪微博大廳文字內(nèi)容滾動(dòng)效果代碼
- JS實(shí)現(xiàn)網(wǎng)頁上隨滾動(dòng)條滾動(dòng)的層效果代碼
- JS實(shí)現(xiàn)的頁面自定義滾動(dòng)條效果
- js+div實(shí)現(xiàn)文字滾動(dòng)和圖片切換效果代碼
- js控制多圖左右滾動(dòng)切換效果代碼分享
- js代碼實(shí)現(xiàn)無縫滾動(dòng)(文字和圖片)
- js實(shí)現(xiàn)Select列表內(nèi)容自動(dòng)滾動(dòng)效果代碼
- 原生js實(shí)現(xiàn)模擬滾動(dòng)條
- JS實(shí)現(xiàn)兼容性較好的隨屏滾動(dòng)效果
相關(guān)文章
JS 實(shí)現(xiàn)緩存算法的示例（FIFO/LRU）
這篇文章主要介紹了JS 實(shí)現(xiàn)緩存算法的示例（FIFO/LRU）,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-03-03
相信大家都知道數(shù)據(jù)可視化就是借助圖形化的手段把生硬的數(shù)據(jù)生動(dòng)化，以此來展示出數(shù)據(jù)想要表達(dá)的信息，而圖表是最通常的一種數(shù)據(jù)可視化手段。可全靠自己純手動(dòng)編寫各種圖表實(shí)在是讓人頭疼，各種計(jì)算各種煩。現(xiàn)在就為大家介紹如何用D3.js來實(shí)現(xiàn)柱狀圖。2016-09-09
利用js實(shí)現(xiàn)Vue2.0中數(shù)據(jù)的雙向綁定功能
vue數(shù)據(jù)雙向綁定是通過數(shù)據(jù)劫持結(jié)合發(fā)布者-訂閱者模式的方式來實(shí)現(xiàn)的,下面這篇文章主要給大家介紹了關(guān)于如何利用js實(shí)現(xiàn)Vue2.0中數(shù)據(jù)的雙向綁定功能的相關(guān)資料,需要的朋友可以參考下2021-07-07
window.addeventjs事件驅(qū)動(dòng)函數(shù)集合addEvent等
addEvent()、removeEvent()、handleEvent()、fixEvent()[2008-02-02
在開發(fā)項(xiàng)目中多次遇到前臺js對象在后臺轉(zhuǎn)化java對象的問題，下面就為大家介紹下前臺js對象轉(zhuǎn)后臺java對象，感興趣的朋友可以了解下2013-12-12
JS前端知識點(diǎn) 運(yùn)算符優(yōu)先級，URL編碼與解碼，String，Math，arguments操作整理總結(jié)
這篇文章主要介紹了JS前端知識點(diǎn) 運(yùn)算符優(yōu)先級，URL編碼與解碼，String，Math，arguments操作,結(jié)合實(shí)例形式整理總結(jié)了javascript運(yùn)算符優(yōu)先級，URL編碼與解碼，String，Math，arguments操作原理及使用技巧,需要的朋友可以參考下2019-06-06
lazyload.js用于長頁面圖片的延遲加載，視口外的圖片會(huì)在窗口滾動(dòng)到它的位置時(shí)再進(jìn)行加載，這是與預(yù)加載相反的，這篇文章主要介紹了lazyload.js詳解,需要的朋友可以參考下2022-09-09
JS中g(shù)etElementsByClassName與classList兼容性問題解決方案分析
這篇文章主要介紹了JS中g(shù)etElementsByClassName與classList兼容性問題解決方案,結(jié)合實(shí)例形式分析了getElementsByClassName與classList的使用方法、原理及兼容性問題的處理技巧,需要的朋友可以參考下2019-08-08
學(xué)習(xí)并匯集javascript匿名函數(shù)
接觸jQuery很長時(shí)間了，對其的實(shí)現(xiàn)有太多疑問，可謂只知道皮毛，對其的精髓一竅不通，可悲?。∷杂斜匾芯肯缕渲械脑?。2010-11-11
這篇文章主要介紹了詳解JavaScript 中的批處理和緩存，幫助大家完成需求，更好的理解和使用JavaScript，感興趣的朋友可以了解下2020-11-11