JS經典代碼
1. 將徹底屏蔽滑鼠右鍵,無右鍵菜單
<body oncontextmenu="window.event.returnvalue=false">
也可以用於網頁中Table架構中
<table border oncontextmenu=return(false)><td>no</table>
2.取消選取、防止複製
<body onselectstart="return false">
3.不準粘貼
<body onpaste="return false">
4.防止複製
<body oncopy="return false;" oncut="return false;">
5.IE地址欄前換成自己的表徵圖
<link rel="Shortcut Icon" href="favicon.ico">
說明:關於favicon.ico檔案的製作。你可以先在FW中做一個圖片,屬於你自己網站一個小表徵圖。然後在ACD see將檔案屬性改為*.ico,然後將你做的*.ICO檔案傳到你的伺服器目錄中,然後就可以使用以上代碼來實現,當別人登陸你的網站時,地址欄裡使用 的就是你自訂的表徵圖了。
6.可以在收藏夾中顯示出你的表徵圖
<link rel="Bookmark" href="favicon.ico">
說明:製作方法和上面的一樣。只是顯示的方式不同,這個是在別人收藏你的網頁地址時顯示的個性表徵圖。也很PP.
7.關閉IME
<input style="ime-mode:disabled">
說明:這段代碼是在表格提交時用到的。也就是在輸入資料時不可以使用其他IME模式。
8.永遠都會帶著架構
<script language="javascript"><!--
if (window == top)top.location.href = "frames.htm";// --></script>
說明:frames.htm為你的網頁,這也是保護頁面的一種方法
9.防止被人frame
<SCRIPT LANGUAGE=javascript><!--
if (top.location != self.location)top.location=self.location;
// --></SCRIPT>
10.網頁將不能被另存新檔
<noscript><iframe src=*.html></iframe></noscript>
說明:<noscirpt>的用法很廣,其中一條就是可以使JS廣告失效。
11.查源檔案
<input type=button value=查看網頁原始碼
onclick="window.location = 'view-source:'+ http://www.wuchongyuan.com';">
12.COOKIE指令碼記錄,有很大的用處哦
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (documents.cookie.length > 0) {
offset = documents.cookie.indexOf(search)
if (offset != -1) { // if cookie exists
offset += search.length
// set index of beginning of value
end = documents.cookie.indexOf(";", offset);
// set index of end of cookie value
if (end == -1)
end = documents.cookie.length;
returnvalue=unescape(documents.cookie.substring(offset, end))
}
}
return returnvalue;
}
function loadpopup(){
if (get_cookie('popped')==''){
openpopup()
documents.cookie="popped=yes"
}
}
說明:以上是JS代碼,請自己加起始符和結束符
13.內架構<IFRAME>使用
Iframe標記的使用格式是:
<iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"
name="main"></iframe>
src:檔案的路徑,既可是HTML檔案,也可以是文本、ASP等; width、height:"內部架構"地區的寬與高;
scrolling:當SRC的指定的HTML檔案在指定的地區不顯不完時,滾動選項,如果設定為NO,則不出現捲軸;如為Auto:則自動出現滾動 條;如為Yes,則顯示; FrameBorder:地區邊框的寬度,為了讓“內部架構“與鄰近的內容相融合,常設定為0。
name:架構的名字,用來進行識別。
比如: 當你想用父架構控制內部架構時,可以使用: target="架構的名字"來控制。
例子:<iframe name="mm" src="http://www.wuchongyuan.com";; width="100%" height="100%" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" scrolling="no"></iframe>
14.自動跳轉
在原始碼中的<head>…</head>加入如下代碼:
<meta http-equiv="refresh"content="3;URL=http://www.wuchongyuan.com; charset=gb2312">
說明:content="3 表示3秒重新整理到URL
15.如何改變連結的滑鼠形狀
只需在連結上加上這一代碼就行的了
或者跟上面的用CSS寫也行
style="cursor:hand" style="cursor:crosshair"
style="cursor:text" style="cursor:wait"
style="cursor:move" style="cursor:help"
style="cursor:e-resize" style="cursor:n-resize"
style="cursor:nw-resize" style="cursor:w-resize"
style="cursor:s-resize" style="cursor:se-resize"
style="cursor:sw-resize"
以上代碼你只需要加到串連或是頁面的style區裡就可以實現滑鼠多樣化。
16.全螢幕顯示
<form>
<div align="center">
<input type="BUTTON" name="FullScreen" value="全螢幕顯示" onClick="window.open(document.location, 'big', 'fullscreen=yes')">
</div>
</form>
把它放到<body>區中。
17.設為首頁
<script language="javascript">
<!--
function defaul_home(){
this.home.style.behavior='url(#default#homepage)';this.home.setHomePage(http://myok.bokee.com/';);
}
var focusok=false;
if (navigator.appName == "Netscape"){
focusok=true;
}
vers=navigator.appVersion;
if (navigator.appName == "Microsoft Internet Explorer"){
pos=vers.lastIndexOf('.');
vers=vers.substring(pos-1,vers.length);
}
proper_version=parseFloat(vers);
if(proper_version>=5){
focusok=true;
}
function launchstock1(htmlurl){
var stock=window.open(htmlurl,"stock","top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,
resizable=no,width=700,height=510");
if(focusok){
stock.focus();
}
return true;
}
function launchstock(){
var stock=window.open("","stock","top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,
resizable=no,width=700,height=510");
if(focusok){
stock.focus();
}
return true;
}
// -->
</script>
<a href="#" name="home" onClick="defaul_home();" title="==吳崇源市場營銷網站==">設為首頁</a>
18.這裡是加入收藏夾的代碼
<a href="#" onClick="window.external.addFavorite(http://www.wuchongyuan.com';.'-=吳崇源 市場營銷網站=-')" target="_self" title="-=吳崇源市場營銷=-">加入收藏夾</a>
19.flash圖片效果
以下代碼加入<head>地區
<SCRIPT language="javascript">
<!--
function makevisible(cur,which){
if (which==0)
cur.filters.alpha.opacity=100
else
cur.filters.alpha.opacity=20
}
//-->
</SCRIPT>
以下代碼加入<body>地區
<img src="http://www.wuchongyuan.com/images/logo.gif";; style="filter:alpha(opacity=20)" onMouseOver="makevisible(this,0)" onMouseOut="makevisible(this,1)" width="63" height="56"> //圖片地址請自己改
20.背景圖片滾動
<body scroll="no" background="images/bg.jpg" link="#00FF00" alink="#FF0000" vlink="#00FF00" bgcolor="#000080" topmargin="8">
<script language="javascript">
var backgroundOffset = 0;
var bgObject = eval_r('document.body');
function scrollBG(maxSize) {backgroundOffset = backgroundOffset + 1;
if (backgroundOffset > maxSize) backgroundOffset = 0;
bgObject.style.backgroundPosition = "0 " + backgroundOffset;}
var ScrollTimer = window.setInterval("scrollBG(410)", 20)
</script>
21.滾動特效
<marquee onMouseOver="this.stop()" onMouseOut="this.start()" scrollamount="2" scrolldelay="0" direction="up" width="330" height="120" border="0" align="center" id="MARQUEE1">
歡迎光臨吳崇源市場營銷網站
我們地址http://www.wuchongyuan.com
</marquee>
22.讓背景圖不滾動
IE瀏覽器支援一個 Body 屬性 bgproperties,它可以讓背景不滾動:
〈Body Background="圖片檔案" bgproperties="fixed"〉
23.讓你的網頁無法另存新檔
<noscript><iframe src=*></iframe></noscript>
24.讓IFRAME架構內的文檔的背景透明
<iframe src="about :<body style='background:transparent'>" allowtransparency></iframe>
25.禁止右鍵:
<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false"onmouseup="document.selection.empty()">
26.進入頁面後立即自動重新整理?
<meta http-equiv="refresh" content="120;url=http://www.wuchongyuan.com">
http://www.wuchongyuan.com,這是你自己的網址。
27.隱藏IFRAME的捲軸三種方法:
1. 設定iframe scrolling="no"
2. 被包含頁body應用overflow:hidden
3. 被包含頁的body標籤加scroll="no"
28.加入背景音樂
<bgsound src="mid/min1.mid" loop="-1"> 只適用於IE
<embed src="music.mid" loop="true" hidden="true"> 對Netscape ,IE 都適用
29.滾動
<MARQUEE direction=up height=146 onmouseout=start() onmouseover=stop() scrollAmount=4></marquee>
30.細線分隔線
<hr noshade size=0 color=#C0C0C0>
31.過度方式
<meta http-equiv="Page-Exit" content="revealTrans(Duration=3,Transition=5)">
Duration的值為網頁動態過渡的時間,單位為秒。
Transition是過渡方式,它的值為0到23,分別對應24種過渡方式。如下表:
0 盒狀收縮 1 盒狀放射
2 圓形收縮 3 圓形放射
4 由下往上 5 由上往下
6 從左至右 7 從右至左
8 垂直百葉窗 9 水平百葉窗
10 水平格狀百葉窗 11垂直格狀百葉窗
12 隨意溶解 13從左右兩端向中間展開
14從中間向左右兩端展開 15從上下兩端向中間展開
16從中間向上下兩端展開 17 從右上方向左下角展開
18 從右下角向左上方展開 19 從左上方向右下角展開
20 從左下角向右上方展開 21 水平線狀展開
22 垂直線狀展開 23 隨機產生一種過渡方式
32.如何控制橫向和縱向捲軸的顯隱?
<body style="overflow-y:hidden"> 去掉x軸
<body style="overflow-x:hidden"> 去掉y軸
<body scroll="no">不顯
33.加入注釋的格式是:
〈!-[注釋內容…]--〉
34.怎樣在網頁中加入 E-mail 連結並顯示預定的主題?
〈A href="wuchongyuan@126.com?subject=主題"〉……〈/a〉
35.定義本網頁關鍵字,可以在〈Head〉〈/Head〉中加入如下代碼:
〈meta name="Keywords" content="吳崇源市場營銷網站"〉
Content 中所包含的就是關鍵字,你可以自行設定。
這裡有個技巧,你可以重複某一個單詞,這樣可以提高自己網站的排行位置,如:
〈meta name="Keywords" content="吳崇源市場營銷"〉
36.添加到收藏夾:
〈a href="java script:window.external.addFavorite(http://www.wuchongyuan.com','http: //www.wuchongyuan.com');"〉添加到收藏夾〈/a〉
37.設為首頁:
〈a href=# onclick=this.style.behavior='url(#default#homepage)'; this.setHomePage(http://www.wuchongyuan.com);〉設為首頁〈/a〉
38.定製瀏覽器地址欄前的小表徵圖:
A:在網頁的〈head〉〈/head〉間加入以下語句:
〈link rel="shortcuticon" href="http://…/icon.ico"〉
即可。其中 icon.ico 為 16x16 的表徵圖檔案,顏色不要超過 16 色。
39.表格的分隔線可以隱藏
<table border rules=cols cellspacing=0 align=left> 可以隱藏橫向的分隔線
<table border rules=rows cellspacing=0 align=right>可以隱藏縱向的分隔線
<table border rules=none cellspacing=0 align=center>可以隱藏橫向和縱向的分隔線
40.表格的邊框不斷在閃
以下方法可以令表格的邊框不斷在閃,很實用的
在BODY區加上
<table border="0" width="280" id="myexample"
style="border:5px solid yellow">
<tr>
<td>加入任意的物件.加入任意的物件.
<br>加入任意的物件.加入任意的物件.
<br>加入任意的物件.加入任意的物件.</td>
</tr>
</table>
<script language="JavaScript1.2">
<!--
function flashit(){
if (!document.all)
return
if (myexample.style.borderColor=="yellow")
myexample.style.borderColor="lime"
else
myexample.style.borderColor="yellow"
}
setInterval("flashit()", 500)
//-->
</script>
41.普通表格
<table border="1" width="220" style="position: absolute; left:
11; top: 11" height="26" >
來源:(http://blog.sina.com.cn/s/blog_5cd9e1790100bgtv.html) - 經典代碼_優值互聯_新浪部落格
<tr>
<td width="100%">普通表格</td>
</tr>
</table>
42.正立方表格
<table border="1" width="220" bordercolorlight="#eeeeee"
bordercolordark="#000000" style="position: absolute; left: 10; top:
49" height="26">
<tr>
<td width="100%">正立方表格</td>
</tr>
</table>
43.細表格
<table border="0" frame=vsides width="219"
bgcolor="#000000" cellspacing="1" cellpadding="0"
height="22" style="position: absolute; left: 11; top: 86">
<tr bgcolor="#FFFFFF">
<td width="100%" height="2">細表格</td>
</tr>
</table>
44.立體表格
<table border="1" width="220" bordercolorlight="#ffffff"
bordercolordark="#ffffff" style="position: absolute; left: 10; top:
112" height="34">
<tr>
<td width="100%" bgcolor="#B7B7B7"
bordercolorlight="#000000" bordercolordark="#eeeeee" >立體表格</td>
</tr>
</table>
45.無名表格
<table width="220" align="center" style="position: absolute;
left: 246; top: 12" height="51">
<tr>
<td><fieldset style="width:220" align="center">
<legend> 無名表格 </legend> <p align="right"> </fieldset>
<br>
</td>
</tr>
</table>
46.表中表效果Ⅱ
<table width="220" align="center" style="position:
absolute; left: 245; top: 89" height="110">
<tr>
<td height="75"><fieldset style="width:220"
align="center"> <legend> 表中表效果Ⅱ </legend> <table
frame="hsides" border="1"
bordercolorlight="#000000" bordercolordark="#ffffff"
width="100%" cellspacing="1" cellpadding="0" height="78">
<tr bgcolor="#ffffff">
<td width="100%" height="76"></fieldset></td>
</tr>
</table>
47.表中表效果Ⅰ
<table width="220" align="center" style="position: absolute;
left: 10; top: 120" height="138" cellspacing="1"
cellpadding="0">
<tr>
<td height="126"><fieldset style="width: 220; color: #B7B7B7;
border-style: groove" align="center"> <legend style="color:
#FFFFFF; border: 1 solid #808080" > <font color="#000000">表中表效果Ⅰ</font>
</legend> <p align="right"> </fieldset>
</td>
</tr>
</table>
48.表格中邊框的顯示
只顯示上邊框 <table frame=above>
只顯示下邊框 <table frame=below>
只顯示左、右邊框 <table frame=vsides>
只顯示上、下邊框 <table frame=hsides>
只顯示左邊框 <table frame=lhs>
只顯示右邊框 <table frame=rhs>
不顯示任何邊框 <table frame=void>
</body>
</html></body>
</html></body>
</html>
製作移動文字,特此說明一點就是把代碼中的*去掉就可以了
<*i><*font size=3 color=Red><*b>今天<*/b><*font size=4 color=Blue>天氣<*/font><*font size=5 color=Fuchsia>真好!<*/font> <*/font><*/i>
今天天氣真好!
今天天氣真好!
<*/marquee><*marquee directio=left>啦啦啦,我從右向左移!<*/marquee>
啦啦啦,我從右向左移!
<*marquee direction=right>啦啦啦,我從左向右移!<*/marquee>
啦啦啦,我從左向右移!
<*marquee direction=up>啦啦啦,我從下向上移!<*/marquee>
啦啦啦,我從下向上移!
<*marquee direction=down>啦啦啦,我從上向下移!<*/marquee>
啦啦啦,我從上向下移!
#=scroll, slide, alternate<*marquee behavior=scroll>啦啦啦,我一圈一圈繞著走!
啦啦啦,我一圈一圈繞著走!
#=scroll, slide, alternate 啦啦啦,我一圈一圈繞著走!
啦啦啦,我一圈一圈繞著走!
<*marquee behavior=slide>啦啦啦,我只走一次就歇了!<*/marquee>
啦啦啦,我只走一次就歇了!
<*marquee behavior=alternate>啦啦啦,我來回走耶!<*/marquee>
啦啦啦,我來回走耶!
<*loop=#> #=次數;若未指定則迴圈不止(infinite)<*marquee loop=3 behavior=scroll>啦啦啦,我只走 3 趟喲!<*/marquee>
#=次數;若未指定則迴圈不止(infinite) 啦啦啦,我只走 3 趟喲!
<*scrollamount=#><*marquee scrollamount=20>改變scrollamount=的數值看看我的速度變化<*/marquee>
改變scrollamount=的數值看看我的速度變化
改變scrollamount=的數值看看我的速度變化
<*scrolldelay=#><*marquee scrolldelay=500 scrollamount=100>我走一步,停一停!改變數值看看變化<*/marquee>
我走一步,停一停!改變數值看看變化
我走一步,停一停!改變數值看看變化
<*align=#> #=top, middle, bottom
<*font size=6><*marquee align=# width=400>啦啦啦,我會移動耶!<*/font> 底色 #=rrggbb 16 進位數位,或者是預定義色彩:<*marquee bgcolor=Aqua>啦啦啦,我會移動耶!<*/marquee>
#=top, middle, bottom
啦啦啦,我會移動耶! 底色 #=rrggbb 16 進位數位,或者是預定義色彩: 啦啦啦,我會移動耶!
什麼是網站 ICO 表徵圖?
開啟微軟、百度等網站後看到瀏覽器的標題列、地址欄,多瀏覽器的標籤上都顯示了一個小表徵圖,如 ,這裡說的就是這個東東。如果使用者收藏了網站,這個表徵圖還 會出現在使用者收藏夾裡。
如何製作 ICO 表徵圖?
這裡使用最簡單的辦法。因為 ico 格式圖片比較特殊,一般軟體(如 Windows 內建的畫圖、Adobe Photoshop 等)都製作不了,我們就分兩步做。
第一步是用 Windows 內建的畫圖或 Adobe Photoshop 製作一個 ico 的原圖,格式可以是 jpg / jpeg / gif / png 等,大小大概在 32×32 像素差不多,最好是 16px×16px 的,因為瀏覽器標題列和地址欄上顯示的就是這個尺寸。
第二步是將製作好的 ico 原圖轉換為 ico 格式,製作好後去一個可以線上轉換 ico 格式的網站(百度一下會有不少,也可以下載一個轉換軟體進行處理)。這裡推薦 http://www.bitbug.net/ ,開啟該網站後介面很清晰明了,經數秒簡單的處理即可轉換為我們要的 ico 格式表徵圖檔案,檔案被自動命名為 favicon.ico。
這樣 ico 表徵圖就製作完成了。
如何讓 ICO 表徵圖在網站上顯示?
在需要顯示該表徵圖的頁面模板頭部(<head> 與 </head> 之間)插入以下代碼:
<link rel="Shortcut Icon" href="/bbs/favicon.ico">