首頁

2013年6月16日 星期日

*Java* script*鏈結圖片^^切換**項目導覽**說明*^浮動*~鏈結選單^~~&幻化**隱現文字&~!

*Java* script*
))鏈結圖片^^切換**
**項目導覽**說明*


^浮動  *~鏈結選單^~~&幻化**隱現文字&~!


**鏈結圖片**
切換^**
*這個範例是把你的滑鼠移至下方的鏈結圖片
或鏈結文字上試試看,很特別吧!會自動切換圖片
,夠酷了吧!**~
*
步驟一:用滑鼠將底下<SCRIPT Language="JavaScript"></SCRIPT>這兩個標記內 
程式碼(含標記本身藍色的喔),標記起來,按滑鼠右鍵選擇 
【複製】〈游標不能離開標示起來的反白區喔〉將以下的控制碼先複製起來。
步驟二:然後在網頁中的 </HEAD> 之前按滑鼠右鍵選擇 
【貼上】將剛剛複製的東東貼上!(其實只要把程式碼貼在<HEAD></HEAD>標記 
中間任何一個地方都可以啦!)
步驟三:然後再將 網頁中的<BODY></BODY>標記中間之間的網頁 
敘述( 有綠色粉藍色敘述兩種)標記起來,按滑鼠右鍵選擇 
【複製】〈游標一樣不能離開標示起來的反白區〉將控制碼先複製起來。
步驟四:在你的網頁中<BODY></BODY>標記中間你要放置鏈結圖片切換特效的位置上 
按滑鼠右鍵選擇【貼上】將剛剛複製的東東貼上!大功告成!
注意:如果你只要單純的圖片切換鏈結,只要使用綠色部分的網頁敘述即可, 
粉藍色部分的網頁敘述可省略   !!!!!!!!!!
 
<HTML>
<HEAD>
<TITLE></TITLE>


<SCRIPT Language="JavaScript">
<!--
// Valor工作室小誌 [valor Studio]
inimage=new Image();
inimage.src="bee.gif"   //滑鼠移進時所要顯現的圖檔
outimage=new Image()
outimage.src="ari.gif"  //滑鼠移出,也就是正常顯現的圖片

function mouse_in(change)
{document.images[change].src=inimage.src}
function mouse_out(change)
{document.images[change].src=outimage.src}
-->
</SCRIPT> 



</HEAD>


<BODY>
<!--移至圖片鏈結所產生的變化敘述-->
<a href="http://www.tw.com/">
<img src="ari.gif" border="0"
name="change" onMouseOver="in('change');" onMouseOut="out('change')"> </a>

 
<!--移至文字鏈結所產生的變化敘述-->
<a href="http://www.twYYXX.com/" onMouseOver="in('change');" onMouseOut="out('change')">YYXX園</a> 



</BODY>
</HTML>
*
*項目導覽~~~說明*
*文字鏈結是最方便的超鏈結方式,但有時候
為了整體網頁的配置而無法的完整表示鏈結 
的目的地,這個時候我們可以設定一個表單 
文字欄位來作詳細的說明!將滑鼠移到下方的 
超鏈結,可以發現其下方的表單文字欄位也會 
同時出現捲動的詳細說明文字***
*
步驟一:用滑鼠將底下的一拖拉庫程式碼(藍色的喔),標記起來,按滑鼠右鍵選擇
【複製】〈游標不能離開標示起來的反白區喔〉將以下的控制碼先複製起來。
步驟二:然後在網頁中的 </HEAD> 之前按滑鼠右鍵選擇【貼上】將剛剛複製的東東貼上!
(其實只要把程式碼貼在<HEAD></HEAD>標記中間任何一個地方都可以啦!)
步驟三:<BODY></BODY>標記中間你要放置說明欄位的地方加上下列網頁敘述!
<FORM NAME="MYFORM">
<input type="text" name="ANS" size="25" value="移至鏈結文字看說明">
</FORM>
步驟四:鏈結的網址敘述必須加入onMouseOver=
"inside(說明文字的編號)" onMouseOut="outside()"             !!!!! 
 
<HTML>
<HEAD>
<TITLE></TITLE>


<SCRIPT LANGUAGE="JavaScript">
<!---
// Valor工作室 [valor Studio]
var mcount = -2
var speed = 100 
//移動時間,越大速度越慢
timeID=setTimeout('',1)
msg = new Array(2)
//2代表有幾個說明項目,請自行加減,配合下的msg[x]使用
msg[1] = "                  最佳討論區"
//空格請依顯示欄位的大小自行調整
msg[2] = "                                   最佳教學網站"

function inside(num)
{
n=num
document.MYFORM.ANS.value = msg[n].substring(mcount=mcount+2,msg[n].length+2)
if (mcount>msg[n].length)
{mcount=-2}
clearTimeout(timeID);
timeID = setTimeout('inside(n)',speed)
}

function outside()
{
clearTimeout(timeID)
mcount = -2
document.MYFORM.ANS.value = "移至鏈結文字看說明"
}
--->
</SCRIPT>

</HEAD>


<BODY>

<FORM NAME="MYFORM">
<input type="text" name="ANS" size="25" value="移至鏈結文字看說明">
</FORM>

<a href="http://www.twYYVV.com/" onMouseOver="inside(
2)" onMouseOut="outside()">YYVV</a><BR>
<a href="http://gb.twYYVV.com"
onMouseOver="inside(
1)" onMouseOut="outside()">YYVV討論版版</a>



</BODY>
</HTML>
*
*浮動*~鏈結選單*~~
**這個表格可是超鏈結的選單喔!*
*
步驟一:用滑鼠將底下<SCRIPT Language="JavaScript"></SCRIPT>這兩個標記內 
程式碼(含標記本身藍色的喔),標記起來,按滑鼠右鍵選擇 
【複製】〈游標不能離開標示起來的反白區喔〉將以下的控制碼先複製起來。
步驟二:然後在網頁中的 </HEAD> 之前按滑鼠右鍵選擇 
【貼上】將剛剛複製的東東貼上! 
(其實只要把程式碼貼在<HEAD></HEAD>標記中間任何一個地方都可以啦!)
步驟三:然後再將 網頁中的<BODY></BODY>標記中間之間的網頁 
敘述( 含綠色粉紅色敘述)標記起來,按滑鼠右鍵選擇 
【複製】〈游標一樣不能離開標示起來的反白區〉將控制碼先複製起來。
步驟四:在網頁中的<BODY></BODY>標記中間按滑鼠右鍵選擇 
【貼上】將剛剛複製的東東貼上!
步驟五:綠色區域的程式碼是建立選單的主要敘述,一定要擺在粉紅色的Java敘述之前,
因為我們要先取得選單顯現與隱藏時的ID(身分號碼)來供給程式作為判斷處理。
步驟六:把本例程式碼標示為橘色的選單項目及其連結更換為你自己的選單項目與連結。
注意:本範例僅適用於IE瀏覽器     !!!!!!!!!
 
<HTML>
<HEAD>
<TITLE></TITLE>


<SCRIPT Language="JavaScript">
<!--
// Valo工作室 [valo Studio]

var changespeed = 20
//設定浮動表格位置更新速度
var Xpos =100 
//浮定表格水平位置設定
var Ypos =300 
//浮定表格垂直位置設定
//初始值設定
function setinit()
{
posX = (document.body.clientWidth-Xpos)
posY = (document.body.clientHeight-Ypos)
}
//捲動軸移動時更新浮動表格位置
function Renew()
{
document.all.mymenu.style.left = posX + (document.body.scrollLeft);
document.all.mymenu.style.top = posY + (document.body.scrollTop);
}
//特效主程式區
function gomove()
{
setinit()
window.onresize=setinit
markID = setInterval ("Renew()",changespeed)
}


//--->
</SCRIPT>YY
</HEAD>

<BODY>
<!--浮動鏈結表格的網頁敘述-->
<span><div id="mymenu" style="position:absolute">
<table border="1" cellspacing="0" cellpadding="2" bgcolor="#FFFF00">
<tr><td><a href="
http://www.twYY.com/">YYVV
</a></td></tr>
<tr><td><a href="
http://gb.twYYVV.com">YYVV討論版版</a></td></tr>
</table></div></span>
<!--呼叫Java浮動表格特效的敘述-->
<script language="JavaScript">
<!--
window.onload=gomove
//-->
</script>




</BODY>
</HTML>
***
*幻化**隱現文字*^
*
步驟一:用滑鼠將底下<SCRIPT Language="JavaScript"></SCRIPT>這兩個標記內 
程式碼(含標記本身藍色的喔),標記起來,按滑鼠右鍵選擇 
【複製】〈游標不能離開標示起來的反白區喔〉將以下的控制碼先複製起來。
步驟二:然後在網頁中的 </HEAD> 之前按滑鼠右鍵選擇 
【貼上】將剛剛複製的東東貼上!
(其實只要把程式碼貼在<HEAD></HEAD>標記中間任何一個地方都可以啦!)
步驟三:<BODY></BODY>標記中間你要放置特效文字的地方加上下列網頁敘述!
<SPAN id=mytext style="POSITION: absolute"></SPAN>
步驟四:網頁中的<BODY>標記要改寫成<BODY onload="colorText();">
這樣才能正確動作哦!大功告成!
注意:本範例最佳適用IE瀏覽器若使用於NetScape瀏覽器則將會有位置的誤差。
 
<HTML>
<HEAD>
<TITLE></TITLE>

<SCRIPT language=JavaScript>
<!--
speed = 100 
//訊息文字變換的速度
big = 6 
//訊息文字的大小
message = "幻化隱現文字"
//欲顯示的訊息文字
count = 0
co = "0123456789abcdef"
//測試瀏覽器是否為IE
if(navigator.appName=='Microsoft Internet Explorer') {testIE =true}
else{testIE=false}


function colorText()
{
if (count > 15){
if (co == "0123456789abcdef")
{
co = "fedcba9876543210"
count = 0
}
else {count=0}
}

//以下為訊息文字的變換色彩設定,可自行變換
a=co.charAt(count)
b=co.charAt(count-2)
c=co.charAt(count+3)
color=c+b+a+a+b+c

//用於NetScapt瀏覽器時的敘述
if(testIE == false)
{
document.mytext.document.write('<p> </p><font size='+big+' color='+color+ '>' +

message +'</font>')
document.mytext.document.close()
}

//用於IE瀏覽器時的敘述
if(testIE == true)
{
document.all('mytext').innerHTML = '<font size='+big+' color=' + color + '>' +

 message +'</font>'
}
count++
setTimeout("colorText()",speed)

}

//-->
</SCRIPT>

</HEAD>
<!--設定網頁下載後就進行文字特效-->
<BODY onload="colorText();">
 <!--文字特效的顯現位置敘述-->
<SPAN
id=mytext style="POSITION: absolute"></SPAN>


</BODY>
</HTML>
*^^*
*******************************************************************************************************************
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&

沒有留言:

張貼留言


if you like make fds, wellcome you here~~anytime***

my free place for everyones who want the good software,

come & download them~ wellcome!!