JavaScript之應用

JDP · 發表於 2005-10-19 11:19:50

很多語法提供

-------------------------------------------------------------------------
背景語法類：

普通背景語法（不重複排列）：
<style type=text/css>


數字部分更改位置
-------------------------------------------------------------------------
背景右下語法：
<STYLE type="text/css">

</STYLE>

-------------------------------------------------------------------------
背景左下語法：
<STYLE type="text/css">

</STYLE>

-------------------------------------------------------------------------
背景左上語法：
<STYLE type="text/css">

</STYLE>

-------------------------------------------------------------------------
背景右上語法：
<STYLE type="text/css">

</STYLE>

-------------------------------------------------------------------------
背景透明語法：
<style type=text/css>

</STYLE>
數字部分更改透明比率

-------------------------------------------------------------------------
隨機背景：
<script language=javascript>
var pic=new Array(6)
pic[0]="圖片網址"
pic[1]="圖片網址"
pic[2]="圖片網址"
pic[3]="圖片網址"
pic[4]="圖片網址"
pic[5]="圖片網址"
var newdate=new Date()
var getpic=newdate.getSeconds()%pic.length
document.write('<body background='+pic[getpic]+' bgproperties=fixed>')
</script>
紅色部分更改圖片數目
以及增加新連結一個＊

-------------------------------------------------------------------------
背景圖外圍模糊：
<style>
body{
background-image : url(背景圖網址);filter:Alpha(Opacity=99,style=2);
background-repeat : repeat;
background-attachment : fixed;}
</style>
語法中　Opacity=90　是模糊度style=2　２是圓形　３是方形

-------------------------------------------------------------------------
圖片語法：

貼圖語法：
<img src="圖片網址">

-------------------------------------------------------------------------
貼圖連結語法：
<a href="連結網址" target=_blank><img src="圖片網址" border="0"></a>

-------------------------------------------------------------------------
連結語法：

連結變色：
<style type="text/css">

</style>

-------------------------------------------------------------------------
連結底色：
<STYLE>
A:HOVER{font-weight : normal;background-color :色馬;}
BODY{text-decoration : none;}
A{text-decoration : none;}
-->
</STYLE>

-------------------------------------------------------------------------
連結點線：
<style type=text/css>

</STYLE>

-------------------------------------------------------------------------
連結不要底線：
<style type="text/css">

</style>

-------------------------------------------------------------------------
連結框線：
<style type=text/css>

</STYLE>

-------------------------------------------------------------------------
連結下壓：
<STYLE type="text/css">

</STYLE>

-------------------------------------------------------------------------
表格特效：

全選表格：
<textarea rows="3" onmouseover="this.focus()" onfocus="this.select()" cols="25" name="form" style="border: 1px dotted #8897FB; ; font-family:Verdana; font-size:10 px; color:色馬; background-color:色馬">內容</textarea>

-------------------------------------------------------------------------
透明表格：
<style>
table,tr,td{background-color:Transparent; border=\"色馬\"}
</style>

-------------------------------------------------------------------------
表格外框（虛線）：
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border: 1px dotted 色馬" bordercolor="色馬" width="150" id="AutoNumber1">
<tr>
<td>
<p align="center"><font size="2" color="色馬">內容</font></td>
</tr>
</table>
紅色部分改粗係

-------------------------------------------------------------------------
表格漸變：
<table width=100 height=80 style="filter:Alpha(opacity=70,style=2);">
<tr><td bgcolor=色馬>
Mandy's Room
</td></tr>
</table>
opacity=透明度,style=1(由左到右由深到淺),style=2(由外到內由淺到深),style=3(由四邊向內由淺到深)bgcolor=背景顏色
-------------------------------------------------------------------------
視窗特效：

無工具視窗：
<a href="javascript://" onClick="window.open('../apeb_gift/apeboard_plus.cgi','PinkyNature',
'menubar=no,status=no,scrollbars=yes,
top=200,left=200,toolbar=no,width=500,height=450')">
連結字樣</a>
紅色部分：視窗寬高

-------------------------------------------------------------------------
公告視窗：
<SCRIPT Language="JavaScript">
config='toolbar=no,location=no,status=no,menubar=no,width=200,height=150'
config += 'scrollbars=no,resizable=no'
wel = window.open ("","welcome",config)
wel.document.write('<script language="javascript">');
wel.document.write('setTimeout(');
wel.document.write('"self.close()');
wel.document.write(';",5000)');
wel.document.write('</');
wel.document.write('script>');
wel.document.write('<body bgcolor=色馬>');
wel.document.write('<center><h5>內容</h5></center>');
wel.document.write('<center><h5>內容</h5></center>');
wel.document.write('</body>');
</SCRIPT>
tips : h5是字體大少,可以自行改成h1-h6,h6為最少,h1為最大
wel.document.write('<body bgcolor=背景顏色>');
wel.document.write('<center><h5>輸入文字</h5></center>');
wel.document.write('<center><h5>可自行複製加行的</h5></center>');

-------------------------------------------------------------------------
加框視窗：
<SCRIPT Language="JavaScript">
if (document.all){
with (window.document.body.style){
borderWidth=5;
borderStyle='solid';
bordercolor='色馬;
}
}
</SCRIPT>
borderWidth=外框寬度;

-------------------------------------------------------------------------
內襄視窗（作網站用）：
<IFRAME SRC="連結網站" width=300 height=200 frameborder="0"></IFRAME>
綠色部分為寬藍色部分為高

-------------------------------------------------------------------------
字體特效：

字色統一：
<style type=text/css>

</style>

-------------------------------------------------------------------------
字有陰影：
<table border="0">
<tr>
<td style="FILTER: dropshadow(color=#cccccc,offx=2,offy=2);color:色馬">
內容

</td></tr></table>

-------------------------------------------------------------------------
版面字體：
<font face="字體">

-------------------------------------------------------------------------
版面字體大小：
<style>
body,tr,td{font:10pt 字體名稱}
</style>
紅色部分請自行修改大小

-------------------------------------------------------------------------
隱藏特效：

剔選隱藏：
<input type=radio onclick="yes.style.display=yes.style.display=='none'?'':'none'" value="open"> ← 連結時內容
<div id=yes style="display:none">

這堨i放任何東西

</div>

-------------------------------------------------------------------------
按字隱藏：
<a style="cursor:sw-resize" onclick="yes.style.display=yes.style.display=='none'?'':'none'">連結時內容</a>
<div id=yes style="display:none">

這堨i放任何東西

</div>

-------------------------------------------------------------------------
增加隱藏：
若想放多一個、必需在語法紅色位置 yes 中
將三個 yes 名字、改做另一 ( 英文 ) 名字才可<input type=radio onclick="yes.style.display=yes.style.display
=='none'?'':'none'" value="on"> ← ＊剔選隱藏連結＊
<div id=yes style="display:none">
這堨i放任何東西</div><input type=radio onclick="hung.style.display=hung.style.display
=='none'?'':'none'" value="on"> ← ＊剔選隱藏連結＊
<div id=hung style="display:none">
這堨i放任何東西</div><input type=radio onclick="hello.style.display=hello.style.display
=='none'?'':'none'" value="on"> ← ＊剔選隱藏連結＊
<div id=hello style="display:none">
這堨i放任何東西</div>

-------------------------------------------------------------------------
滑鼠語法：

鎖右鍵（無對話框彈出）：
<body oncontextmenu="window.event.returnValue=false">
-------------------------------------------------------------------------
鎖右鍵（有對話框彈出）：
<script language="JavaScript">
</script>
隔行請使用\n

-------------------------------------------------------------------------
音樂：

背景音樂：
<bgsound src="音樂網址" loop="-1">

-------------------------------------------------------------------------
隨機撥放音樂：
<SCRIPT Language="JavaScript">
tips = new Array(4);
tips[0] = "音樂網址";
tips[1] = "音樂網址";
tips[2] = "音樂網址";
tips[3] = "音樂網址";index = Math.floor(Math.random() * tips.length);
document.write("<EMBED SRC=" + tips[index] + " autostart=true width=0 height=0 loop=true hidden=TRUE></EMBED>");
</SCRIPT>
藍色部分可增加音樂數目

-------------------------------------------------------------------------
隨機撥放音樂（有撥放器）：
<SCRIPT LANGUAGE="JavaScript">
var random=Math.floor(5*Math.random()+1)
var str
if (random==1){music="音樂網址"; str="歌名";}
if (random==2){music="音樂網址"; str="歌名";}
if (random==3){music="音樂網址"; str="歌名";}
if (random==4){music="音樂網址"; str="歌名";}
if (random==5){music="音樂網址"; str="歌名";}
document.write('<embed src='+music+' width=280 height=44 loop=true autostart=true controls=smallconsole><br>')
var random=document.write("<font size=3 color=色馬>內容　→</font><font size=3 color=色馬>　"+str+" </font>")
</SCRIPT>
紅色部分＊改撥放器大小　綠色部分改字體大小

-------------------------------------------------------------------------
音樂盒：
<bgsound id=bs><select onChange="bs.src=this.value" name="select" class="w" size="1"style="background-color:背景色馬">
<option>內容</option>
<option value="網址">歌名
<option value="網址">歌名
</select>

每加一首音樂　在適當位置加以下

　<option value="網址">歌名

-------------------------------------------------------------------------
捲軸語法：

捲軸語法：
<STYLE type="text/css">
BODY {scrollbar-highlight-color: blue;
scrollbar-face-color: ORANGE;
scrollbar-shadow-color: YELLOW;
scrollbar-3dlight-color: white;
scrollbar-arrow-color: red;
scrollbar-track-color: yellow;
scrollbar-darkshadow-color: purple;}</STYLE>
第一色是：捲軸邊頂色
第二色是：拉的位置中間顏色
第三是：捲軸底邊色
第四是：捲軸上邊最邊色
第五是：三角形箭咀色
第六是：捲軸底色
第七是：最底邊邊色

-------------------------------------------------------------------------
變色捲軸：
<script language="javascript1.2">
function clrBar(line,face){
with(document.body.style){
scrollbarDarkShadowcolor=line;
scrollbar3dLightcolor=line;
scrollbarArrowcolor="white";
scrollbarBasecolor=face;
scrollbarFacecolor=face;
scrollbarHighlightcolor=face;
scrollbarShadowcolor=face;
scrollbarTrackcolor="black";
}}function setcolor(){
var w = document.body.clientWidth;
var h = document.body.clientHeight;
var x = event.clientX;
var y = event.clientY;
if(x>w) clrBar("yellow","red");
else clrBar("pink","blue");
}if (document.all){clrBar(null,null);
document.onmousemove=setcolor;
}</script>
滑鼠指捲軸會變色
但不可與任何滑鼠帶字共用
scrollbarArrowcolor="white　三角形箭咀色
scrollbarArrowcolor="black　捲軸底色
("pink","blue"); 是原本色
("yellow","red"); 是指向色

-------------------------------------------------------------------------

游標語法

<style></style>

-------------------------------------------------------------------------

CCS用

body{cursor:url(\"游標網址\");}

-------------------------------------------------------------------------

Reference:

		自動登錄	找回密碼
密碼			註冊