TShopping

 找回密碼
 註冊
搜索
查看: 2522|回復: 3

[教學] 網頁頁面特效集錦

  [複製鏈接]
發表於 2009-1-15 13:10:47 | 顯示全部樓層 |閱讀模式
 
Push to Facebook Push to Plurk Push to Twitter 
文章來源 : 網頁設計

網頁頁面特效集錦

1.頁面自動更新
<meta http-equiv="refresh" c>



2.網頁自動轉頁
<META HTTP-EQUIV="Refresh" C>



3.點擊右鍵提醒加入書簽
<SCRIPT language=&#106avascript><!--
function click() {
if (event.button==2) {window.external.addFavorite(http://',這裏是你的網頁名)}}
document.&#111nmousedown=click
// --></SCRIPT>



4.簡單的頁面加密
 <script LANGUAGE="&#106avascript">
 <!--
 function loopy(){
  var sWord ="";
  while(sWord!="login"){sWord=prompt("請輸入你的登陸密碼");}
  alert("登陸成功!\\\\");}
 loopy()
 //-->
 </script>



5.自動滾屏
<script Language="&#106avascript"><!--
function scrollit(){
for (I=1; I<=500; I++){
parent.scroll(1,I)}}
//--></script>



6.去掉窗口捲軸
scroll="no" style="overflow-y:hidden"



7.忽視右鍵
<body >或<body style="overflow-y:hidden">



8.加入背景音樂
IE:<bgsound src="*.mid" loop=infinite>
NS:<embed src="*.mid" autostart=true hidden=true loop=true></embed>
*.mid你的背景音樂的midi格式檔



9.自動開啟和關閉視窗
<script Language="&#106avascript">
function winopen1(){
打開的視窗名=open("nb","Homepage","toolbar=no,location=no,
directories=no,status=no,menubar=no,scrollbars=no,resizable=no,
copyhistory=no,width=160,height=200,left=200,top=100"); }
</script><a href &#111nMouseOver="winopen1();return true;"&#111nMouseOut="打開的視窗名.close();">
<p>這裏是連接</a></p>



10.固定背景圖不動
 <style>
 body{background-image:url(logo.gif);
 background-repeat:no-repeat;background-position:center}
 </style>



11.讓流覽器在保存頁面時保存失敗
<NOSCRIPT><iframe src="*.html"></iframe></NOSCRIPT>



12.網頁自動關閉
 <html>
 <head>
 <object id=closes type="application/x-oleobject"
 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">
 <param name="Command" &#118alue="Close">
 </object>
 </head>
 <body >
 這個視窗會在10秒過後自動關閉,而且不會出現提示.
 </body>
 </html>



13.禁止查看源代碼
<SCRIPT language=&#106avascript>
function click() {if (event.button==2) {alert(你想幹嘛!);}}document.&#111nmousedown=click
</SCRIPT>



14.頁中頁
<iframe name="main" src=http://www.com width="350" scrolling="NO" height="380" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0"></iframe>

<iframe src="123.htm" width="360" height="240" scrolling="auto"></iframe>



15.如何在dw中設置flash背景為透明
wmode=transparent



16.滾動的文字
<marquee direction=up height=130 scrollamount=1
scrolldelay=100 style="COLOR: #800000; FONT-SIZE: 9pt"
width=148
150?> 大家好!</marquee>

<body>
<SCRIPT language=javascript1.2>
if (document.all)
document.body.onmousedown=new Function("if (event.button==2||event.button==3)window.external.addFavorite(http://www.5dci.com,青春狂想)")
</SCRIPT>
</body>



17、讓IFRAME框架內的文檔的背景透明
<iframe src="about :<body style=background:transparent>"
allowtransparency></iframe>



18、打開視窗即最大化
<script language="javascript">
<!-- Begin
self.moveTo(0,0)
self.resizeTo(screen.availWidth,screen.availHeight)
// End -->
</script>



19、能隱藏IFRAME的捲軸嗎?我知道的三種方法:
(1). 設置iframe scrolling="no"
(2). 被包含頁body應用overflow:hidden
(3). 被包含頁的body標籤加scroll="no"



20、細線分隔線
<hr noshade size=0 color=#C0C0C0>



21、網頁過渡方式

<meta http-equiv="Page-Exit"
c>
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 隨機產生一種過渡方式



22、如何控制橫向和縱向捲軸的顯隱?
<body style="overflow-y:hidden"> 去掉x軸
<body style="overflow-x:hidden"> 去掉y軸
<body scroll="no">不顯



23、怎樣在 FrontPage2000 中加入 Flash 動畫?
在 FrontPage2000 中,點擊[插入]->[高級]->[插件],在彈出的視窗中,設置一下 Flash 檔的大小及其它資訊,確定即可。



24、加入注釋的格式是:    
<!-[注釋內容…]-->



25、怎樣在網頁中加入 E-mail 鏈結並顯示預定的主題?
<A href="mailtEmailhost@123.com?subject=主題">……</a>



26、定義本網頁關鍵字,可以在〈Head〉〈/Head〉中加入如下代碼:  
<meta name="Keywords" c>  
Content 中所包含的就是關鍵字,你可以自行設置。   
這裏有個技巧,你可以重複某一個單詞,這樣可以提高自己網站的排行位置,如:
<meta name="Keywords" c>



27、添加到收藏夾:
<a href="(script removed)window.external.addFavorite(http://鏈結,說明
);">添加到收藏夾</a>



28、設為首頁:
<a href=# onclick=this.style.behavior=url(#default#homepage);this.setHomePage
(http://鏈結);>設為首頁</a>



29、定制流覽器位址欄前的小圖示:
A:在網頁的<head></head>間加入以下語句:<link rel="shortcuticon" href="favicon.ico">即可。其中favicon.ico 儘量為 16x16 的圖示檔。
B:加入收藏夾中顯示的圖示: <link rel="BOOKMARK" href="favicon.ico">



30、把捲軸放在流覽器窗口的左邊
A:在 <body> 中加 dir=RTL,即 <body dir=RTL>。



31、讓背景圖不滾動
IE流覽器支援一個 Body 屬性 bgproperties,它可以讓背景不滾動:
<Body Background="圖片檔" bgproperties="fixed">

*如何在網頁中加入單個或幾個空格?
*在源代碼中輸入 ,每個 之間請用空格分開。
*在Dreamweaver中用<CTRL>+<SHIFT>+<SPACE>插入空格或任輸幾個字元,然後將其色彩設成背景的色彩!

*如何在網頁中加入書簽,在頁面內任意跳轉?
*在源代碼中需要插入書簽的地方輸入<a name="top"></a>,在調用的地方輸入<a href="#top">Top</a>,其中的top是你設定的書簽名字。
*在Dreamweaver中用功能表的「Insert」-「Name Anchor」命令插入書簽,調用時,在Link中輸入#top,top為書簽名。

*如何在網頁中加入書簽,在多個頁面之間任意跳轉?
*方法與上面類似,不過做鏈結時要在書簽名前加上網頁檔案名,如:other.htm#top,這樣一來就會跳轉到other.htm頁面中的top書簽處。

*將網頁加入收藏夾?
*請使用如下代碼:(注意標點符號)
< a href=’#’ tag.php?name=%E9%9B%BB%E8%85%A6">電腦資訊等主題的論壇。’)" target="_top">將本站加入收藏夾< /a>

*如何去掉鏈結的下劃線?
*在源代碼中的<HEAD>…</HEAD>之間輸入如下代碼:
<style type="text/css"> <!--
a { text-decoration: none}
--> < /style>
*在Dreamweaver中用「Text」-「Custom Style」-「Edit Style Sheet」-「New」-Redefine HTML Tag中選擇a,然後在decoration中選中none

*如何將網頁定時關閉?
*在源代碼中的<BODY>後面加入如下代碼:
< script LANGUAGE="JavaScript"> <!--
setTimeout(’window.close();’, 60000);
--> < /script>
在代碼中的60000表示1分鐘,它是以毫秒為單位的。

*如何設置命令來關閉打開的視窗?
*在源代碼中加入如下代碼:
< a href="/" >關閉窗口< /a>

*如何製作電子郵件表單?
*在<FORM>中輸入Action="youremail@XXX.XXX" ,提交採用POST方法。

*如何自動加入最後修改日期?
*在源代碼中的<BODY>…< /BODY>之間加入如下代碼:
< Script Language="JavaScript"><!--
document.write("Last Updated:"+document.lastModified);
-->< /Script>

*如何在網頁中加入EMAIL鏈結並顯示預定的主題?
*代碼:< a href="mailtyourmail@xxx.xxx?Subject=你好">Send Mail< /a>

*如何讓背景圖像不滾動?
*代碼:<BODY Background="bg.gif" Bgproperties="fixed" >
*在Dreamweaver中用「Text」-「Custom Style」-「Edit Style Sheet」-「New」-Redefine HTML Tag中選擇Body,然後在Background中的Attachment裏選fixed

*如何避免別人將你的網頁放入他的框架(FRAME)中?
*在源代碼中的<HEAD>…< /HEAD>之間加入如下代碼:
<script language="javascript"><!--
if (self!=top){top.location=self.location;}
-->< /script>

*如何在網頁中加入注釋?
*代碼:< !-- 這是注釋 -->

*如何定義網頁的關鍵字(KeyWords)?
*格式如下:
< meta name="keywords" c>
content中的即為關鍵字,用逗號隔開
*在Dreamweaver中用「Insert」-「Head」-KeyWords命令

*如何為不支援框架的流覽器指定內容?
*在源代碼中加入下面代碼:
< BODY><noframes>本網頁有框架結構,請下載新的流覽器觀看< /noframes></ BODY>

*如何使表格(TABLE)沒有邊框線?
*將表格的邊框屬性:border="0"

*如何隱藏狀態欄裏出現的LINK資訊?
*請使用如下代碼:
< a href="http://"; >speak-up< /a>

*如何為網頁設置背景音樂?
*代碼:< EMBED src="music.mid" autostart="true" loop="2" width="80" height="30" >
src:音樂檔的路徑及檔案名;
autostart:true為音樂檔上傳完後自動開始播放,默認為false(否)
loop:true為無限次重播,false為不重播,某一具體值(整數)為重播多少次
volume:取值範圍為"0-100",設置音量,默認為系統本身的音量
starttime:"分:秒",設置歌曲開始播放的時間,如,starttime="00:10",從第10開始播放
endtime: "分:秒",設置歌曲結束播放的時間
width:控制面板的寬
height:控制面板的高
controls:控制面板的外觀
c
•console:正常大小的面板
•smallconsole:較小的面板
•playbutton:顯示播放按鈕
•pausebutton:顯示暫停按鈕
•stopbutton:顯示停止按鈕
•volumelever:顯示音量調節按鈕
hidden:為true時可以隱藏面板

*如何定時載入另一個網頁內容?
*在源代碼中的<HEAD>…< /HEAD> 加入如下代碼:
< meta http-equiv="refresh" c >
40秒後將自動載入http://所在的網頁



32、自動轉向代碼

<meta http-equiv="refresh" c>

 

臉書網友討論
發表於 2012-1-3 00:57:45 | 顯示全部樓層
謝謝哦  

版主招募中

發表於 2012-8-31 20:21:46 | 顯示全部樓層
好多~感覺蠻實用,但不知要貼在哪~"~


發表於 2014-7-18 14:36:19 | 顯示全部樓層
好贴就是好贴











bjcars.net


您需要登錄後才可以回帖 登錄 | 註冊 |

本版積分規則



Archiver|手機版|小黑屋|免責聲明|TShopping

GMT+8, 2016-12-4 09:47 , Processed in 0.059915 second(s), 18 queries .

本論壇言論純屬發表者個人意見,與 TShopping綜合論壇 立場無關 如有意見侵犯了您的權益 請寫信聯絡我們。

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回復 返回頂部 返回列表