Maison > interface Web > js tutoriel > le corps du texte

js浮动图片的动态效果_javascript技巧

WBOY
Libérer: 2016-05-16 17:29:11
original
1237 Les gens l'ont consulté
复制代码 代码如下:





浮动图片



js浮动图片的动态效果_javascript技巧 style="max-width:90%" />



另一种的实现方式
复制代码 代码如下:




浮动广告实例



     style="Z-INDEX: 100;
     LEFT: 12px;
     WIDTH: 159px;
     POSITION: absolute;
     TOP: 143px;
     HEIGHT: 161px;
 visibility: visible;">
 
 
 js浮动图片的动态效果_javascript技巧
 

 

<script><BR>var xPos = 0;<BR>var yPos = 0;<BR>var step = 3;<BR>var delay = 100;<BR>var height = 0;<BR>var Hoffset = 0;<BR>var Woffset = 0;<BR>var yon = 0;<BR>var xon = 0;<BR>var pause = true;<BR>var interval;<BR>img1.style.top = yPos;<BR>function changePos()<BR>{<BR> width = document.body.clientWidth; //获取浏览器的宽度<BR> height = document.body.clientHeight; //获取浏览器的高度<BR>Hoffset = img1.offsetHeight;<BR>Woffset = img1.offsetWidth;<BR>img1.style.left = xPos + document.body.scrollLeft;<BR>img1.style.top = yPos + document.body.scrollTop;<BR>if (yon)<BR>{yPos = yPos + step;}<BR>else<BR>{yPos = yPos - step;}<BR>if (yPos < 0)<BR>{yon = 1;yPos = 0;}<BR>if (yPos >= (height - Hoffset))<BR>{yon = 0;yPos = (height - Hoffset);}<BR>if (xon)<BR>{xPos = xPos + step;}<BR>else<BR>{xPos = xPos - step;}<BR>if (xPos < 0)<BR>{xon = 1;xPos = 0;}<BR>if (xPos >= (width - Woffset))<BR>{xon = 0;xPos = (width - Woffset); }<BR>}<BR>function start()<BR>{<BR>img1.visibility = "visible";<BR>interval = setInterval('changePos()', delay);<BR>//interval = setTimeout("changePos()", delay);<BR>}<BR>function pause_resume()<BR>{<BR>if(pause)<BR>{<BR>clearInterval(interval);<BR>pause = false;}<BR>else<BR>{<BR>interval = setInterval('changePos()',delay);<BR>pause = true;<BR>}<BR>}<BR>start();<BR></script>



JS实现气泡从水中急速上升效果
复制代码 代码如下:



JS实现气泡从水中急速上升效果








浮动广告
复制代码 代码如下:




浮动广告







Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!