»
Tiếng AnhTiếng PhápTiếng Việt

In - Ảnh động cho menu - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Trình đơn » Ảnh động cho menu
URL: https://www.javascriptbank.com/rollover-earthquake-index.html

Ảnh động cho menu © JavaScriptBank.comHiệu ứng sử dụng các hình ảnh để làm trình đơn và tác động hiệu ứng động đây cho ảnh mỗi khi người dùng rê con trỏ chuột vào các trình đơn này.

Phiên bản đầy đủ: jsB@nk » Trình đơn » Ảnh động cho menu
URL: https://www.javascriptbank.com/rollover-earthquake-index.html



CSS
<STYLE>.quakestyle {POSITION: absolute}</STYLE><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT>/*CREDITS:Menu EarthQuake- &#3593; Peter Gehrig and Urs DudliCONFIGURATION:-Download the ZIP-file of this script.- The script is hidden in the file "imagequakemenu.html".-Create a separate span-container for each imagebutton.-Give each span-container a unique identity (id) of its own.-Link each imagebutton to an URL (of your choice (in this demonstration the URL is "#") -Add a onmouseover-tag to each imagebutton as follows: onMouseOver="quakeme('funstuff','10','90')". 'funstuff' is the name of the span-container where the imagebutton resides. '10' is the horizontal position of the imagebutton measured in pixels. '90' is the vertical position of the imagebutton.-Copy the style-block and paste it into the head-zone of your menu-file.-Copy the script-block and paste it into the head-zone of your menu-file.-Configure the strength and duration of the earthquake as follows:*/// strength of earthquakevar quakestrength=5// duration of earthquakevar max_quake=12// ------------------------------------------------------------------------------// Do not edit the script below the linevar thisspanvar i_quake=0var pause=5var x_pos,y_posvar occupied=0function quakeme(spanname,x,y) {if (occupied==0) {i_quake=0x_pos=xy_pos=yif (document.all) {thisspan=eval("document.all."+spanname+".style")}if (document.layers) {thisspan=eval("document."+spanname)}quakeme2()}}function quakeme2() {quakestrength=quakestrength*(-1)if (document.all&&i_quake<max_quake) {occupied=1thisspan.posTop+=quakestrengththisspan.posLeft+=quakestrengthvar timer=setTimeout("quakeme2()",pause)i_quake++}else if (document.layers&&i_quake<max_quake) {occupied=1thisspan.top+=quakestrengththisspan.left+=quakestrengthvar timer=setTimeout("quakeme2()",pause)i_quake++}else {clearTimeout(timer)thisspan.posTop=y_posthisspan.posLeft=x_posoccupied=0}}</SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<SPAN class=quakestyle id=contact style="LEFT: 10px; TOP: 10px"><A href="http://JavaScriptBank.com" onmouseover="quakeme('contact','10','10')"><IMG border=0 src="contactgreen152.gif" width="105" height="20"></A></SPAN> <SPAN class=quakestyle id=download style="LEFT: 10px; TOP: 50px"><A href="http://JavaScriptBank.com" onmouseover="quakeme('download','10','50')"><IMG border=0 src="downloadgreen152.gif" width="105" height="20"></A></SPAN> <SPAN class=quakestyle id=funstuff style="LEFT: 10px; TOP: 90px"><A href="http://JavaScriptBank.com" onmouseover="quakeme('funstuff','10','90')"><IMG border=0 src="funstuffgreen152.gif" width="105" height="20"></A></SPAN> <SPAN class=quakestyle id=it style="LEFT: 10px; TOP: 130px"><A href="http://JavaScriptBank.com" onmouseover="quakeme('it','10','130')"><IMG border=0 src="itgreen152.gif" width="105" height="20"></A></SPAN> <SPAN class=quakestyle id=sponosr style="LEFT: 10px; TOP: 170px; WIDTH: 120px"></SPAN><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/menu/Rollover_EarthQuake/Rollover_EarthQuake_images.zip