成人午夜激情影院,小视频免费在线观看,国产精品夜夜嗨,欧美日韩精品一区二区在线播放

當前位置:首頁>>軟件教程>>網頁制作>>新聞內容
網頁制作隱藏對象巧利用
作者:阿水仔 發布時間:2004-4-15 9:23:03 文章來源:《大眾軟件》

  在網頁制作中,通過一些隱藏對象,如隱藏IFrame、隱藏表單對象、隱藏圖片的應用,通常能起到加速網頁下載速度或增強網頁交互功能的作用。下面筆者就通過幾個實例來說明應用的方法。
 
  一、使用隱藏圖片實現圖片交換效果

  一般實現圖片交換效果(如鼠標移入和移出或點擊交換),都是通過在JavaScript代碼中改變圖片的來源屬性SRC實現。其弊端是每次切換圖片時都必須重新下載新圖片,在圖片較大或網速較慢的情形下無疑會出現等待下載的問題。有些網頁編輯器如Dreamweaver中提供了預下載(Preload)的函數,但實際上據筆者在IE 6.0中測試發現并不能解決此問題。

  現在筆者提供一種方法,在下載網頁時將要交換的圖片全部下載,并將其位置設為相同(利用CSS屬性)。在交換時改變圖片CSS屬性中的可見性屬性(Visibility)為隱藏(Hidden)或可見(Visible),即可避免重新下載新圖片。下面是一個鼠標移出移入交換Pic1.jpg和Pic2.jpg的實例。
 
 <script language="javascript">
 function change_img(from_img,to_img){ //將from_img替換為to_img
  document.images[from_img].style.visibility = "hidden";
  document.images[to_img].style.visibility = "visible";
 }
 </script>
 
 <span style="position:absolute; left:0px; top:0px;" onMouseOver="change_img('img1','img2')" onMouseOut="change_img('img2','img1')" >
  <img name="img1" src="pic1.jpg" style="position:absolute; left:0px; top:0px;">
  <img name="img2" src="pic2.jpg" style="position:absolute; left:0px; top:0px;visibility:hidden;">  <!--預先將img2設為隱藏!-->
 </span>
 
  注意此例中塊元素Span的引進是必要之步(也可用Div等替換),如果是點擊交換圖片則無需使用。另外,如果你不想讓圖片的位置固定,也可臨時在JavaScript代碼中讓img2的位置等于img1的位置。(西部E網www.wsalc.com )推薦使用這種方法。
 
  二、利用隱藏表單對象增強交互性

  留言板的留言區,這個留言板允許訪問者選擇表情符。我們假設設計者已在網頁中實現了將訪問者所選表情符的代號存入了全局變量Faceid中,那如何能在提交表單時將這個變量傳遞給服務器呢?其實只需用一個隱藏類型(Hidden)的表單對象即可解決問題。

  在表單部分這樣書寫:

 <form name="writer" action="server.php" method="post">
 <!--此處省略了其它表單對象!-->
  <input type="button" value="寫好了" onclick="verify()">
  <!--在提交前使用verify函數進行驗證。!-->
  <input name="faceid_save" type="hidden">
 </form>

  在驗證表單函數中這樣書寫:

 function verify() {
 //此處省略了其他驗證部分,即運行至此已通過其他驗證
  document.writer.faceid_save.value = faceid;
  document.writer.submit();
 }
 
  三、隱藏IFrame在服務器交互頁面中的使用

  在設計PHP、ASP等面向服務器的網頁時,經常會涉及到服務器端數據庫或文件的操作,比如說記錄用戶IP、網站訪問量、頁面鏈接訪問量等。如果將這些操作的代碼和要發給用戶端的內容放在一個網頁文件中,就會影響用戶下載的速度,因為服務器首先要處理完這些操作代碼才會將生成的頁面發給訪問者。特別是現在有一些虛擬機服務器,處理數據庫特別慢,在這種情況下,除了避免數據庫操作(如盡量使用文本文件記錄信息)之外,就需另想辦法。以下操作以PHP為例。

  下例中將針對服務器的操作代碼分離出來,放入一個獨立的PHP文件,如Server.php。在主頁面中加入一個隱藏的內嵌頁面(inner frame,IFrame,如圖2:通常沒有隱藏的IFrame效果),并將Server.php放入內嵌頁面打開,而其他內容仍放在主頁面,由于內嵌頁面的下載并不會影響主頁面的下載,這就提高了速度。在主頁面中的具體代碼只需如下書寫:
 
 <IFRAME NAME="pagename" SRC="server.php" WIDTH="0" HEIGHT="0"></IFRAME>
 <!--這里將iframe的高和寬設為0實現隱藏。!-->
 
  同樣,如果需要記錄某個鏈接的點擊量也可同樣設計:
 
 <IFRAME NAME="clicksave" SRC="" WIDTH="0" HEIGHT="0"></IFRAME>
 <a href="你要鏈接的內容" target="_blank" OnClick="javascript:window.clicksave.location='server.php'">鏈接顯示內容</a>
 <!--在打開鏈接的同時將server.php在clicksave內嵌頁面中打開!-->
 
  總結:以上提供了3種簡單使用隱藏對象的方法,實際上利用隱藏對象還能實現更多奇特的效果,比如將網頁設計成Windows桌面形式,多窗口的形式就可使用隱藏IFrame實現。因此這里只能算是拋磚引玉了,大家可根據需要進行靈活應用。

  西部E網www.wsalc.com補充:隱藏對象還有一個功能就是美化頁面。如果你的網站上有一些統計流量的代碼,但是你卻不希望顯示出來,那么你可以將他們放在一個 div 中,然后用visibility:hidden的方法將div隱藏,這樣既能統計信息又能美化頁面,怎么樣?(西部E網www.wsalc.com

  西部E網 http://www.wsalc.com 提示:直接使用文中代碼請先將全角“<>”替換成半角“<>”。


最新更新
·如何去掉ECShop2.7中的Powered by ECSh
·在IE7下生成高質量CSS縮略圖
·解決Dreamweaver打開和關閉時出現JavaS
·影響搜索引擎排名的因素2009版
·IE6/IE7/IE8/Firefox/Chrome/Safari的C
·Flash對聯廣告及關閉按鈕制作方法
·Discuz! 7中如果設置帖子中顯示圖片而不
·5種方法立刻寫出更好的CSS代碼
·兼容IE和Firefox的按圖片寬度縮放的CSS
·兼容Firefox和IE瀏覽器的“加入收藏”代
相關信息
·隱藏你的網頁中的Table表格
畫心
愚愛
偏愛
火苗
白狐
畫沙
犯錯
歌曲
傳奇
稻香
小酒窩
獅子座
小情歌
全是愛
棉花糖
海豚音
我相信
甩蔥歌
這叫愛
shero
走天涯
琉璃月
Nobody
我愛他
套馬桿
愛是你我
最后一次
少女時代
灰色頭像
斷橋殘雪
美了美了
狼的誘惑
我很快樂
星月神話
心痛2009
愛丫愛丫
半城煙沙
旗開得勝
郎的誘惑
愛情買賣
2010等你來
我叫小沈陽
i miss you
姑娘我愛你
我們都一樣
其實很寂寞
我愛雨夜花
變心的玫瑰
犀利哥之歌
你是我的眼
你是我的OK繃
貝多芬的悲傷
哥只是個傳說
丟了幸福的豬
找個人來愛我
要嫁就嫁灰太狼
如果這就是愛情
我們沒有在一起
寂寞在唱什么歌
斯琴高麗的傷心
別在我離開之前離開
不是因為寂寞才想你
愛上你等于愛上了錯
在心里從此永遠有個你
一個人的寂寞兩個人的錯
主站蜘蛛池模板: 永兴县| 嘉祥县| 泗阳县| 西宁市| 定州市| 黄山市| 平山县| 合作市| 红原县| 石棉县| 汝南县| 海盐县| 威信县| 金湖县| 邹城市| 西丰县| 白水县| 徐州市| 苍南县| 上栗县| 桐城市| 喀喇沁旗| 雅安市| 河源市| 苍山县| 宣城市| 新昌县| 邯郸市| 蓬安县| 云梦县| 长岭县| 高密市| 通海县| 嘉定区| 工布江达县| 江城| 杨浦区| 鄢陵县| 太湖县| 朝阳县| 内丘县|