Princess Party

Princess Party - 網頁教學

主選單

網頁教學

霧化遮蓋圖片顯示

2008/05/22 (Thu)
  • 此特效能讓圖片在同框架在霧化的背景下顯示圖片,作為點圖放大或是照片瀏覽器時會有不錯的效果!
    使用前需先下載 http://rei.idv.tw/sample/parts/popup.js 這個檔案,並將其與 html 放置於同資料夾下。

原始碼

設定方式

  • 【修改霧化區塊的設定方式】
     在 Style 區域裡面第 3 行的 top: 70px; 這一段,代表的意思是圖片在霧化區塊中上方間距。
     後面的 text-align: center; 這一段,代表圖片在霧化區塊中的顯示位置,若要改為置左或置右,可自行指定為 left 或 right。
     第 4 行的 border: 3px solid #fff; 是給圖片在霧化區塊裡加上邊框,若要給圖片加任何 CSS 效果都可以在這裡自行修改。
     第 5 行的 background: #000; 是霧化區塊的顏色,預設為黑霧,若要改成其他顏色可以自行在此修改色碼。

    【注意事項】
     此特效必須要包在一組 <div id="main"></div> 之間。
     <noscript> 區為無法使用 Java Script 時的替代效果。

取材網站

相關回應

請問

2010/10/21 (Thu)
  • 請問google瀏覽器有許多html都不支援嗎?
    很多時候我用google開啟都沒有效果
  • Edit / Delete
     

Rei

No Subject

2010/10/22 (Fri)
  • 那得看用的是什麼語法
    一般來說規範裡的語法都是支援的
    甚至CSS3的部分也只有Google瀏覽器支援的最完整

    會看到不支援的語法,多半都是IE或其他瀏覽器的專屬語法才會不支援
  • Mail
  • Home
  • Edit / Delete
     

 

2010/10/24 (Sun)

發表回應

您可以利用以下表單發表您對本篇的回應

  • 表情:            
紙娃娃設定

次選單

訪客人次

  • Total: 89251
  • Today: 24
  • Yesterday: 17

新作塗鴉

  • 兀兒德>_<兀兒德>_< by 兀兒德
    2009/09/12(Sat)12:00:38

最近迴響

  • 759554620: 台中找女人.台中喝茶台中找茶line:sex759...
  • 759554620: 台中找女人.台中喝茶台中找茶line:sex759...
  • 婷婷: ◆安安 謝謝.*~`您在忙的時候看貼婷婷下的...
  • 759554620: 台中找女人.台中喝茶台中找茶line:sex759...
  • 雨潔: 大台灣吃魚喝茶外送魚樂網小雨頂級外送茶...
  • 雨潔: 大台灣吃魚喝茶外送魚樂網小雨頂級外送茶...
  • 奈美: 奈美北中南一夜情吃魚喝茶茶坊:Line:akb...
  • 雪兒: 看圖約妹 兼職外送 ‧【茶】雪兒Line:dd...
  • : 藤子外送茶莊line:honey5201精心篩選正妹...
  • 蘇珊正妹外送茶坊 line:cai4094 : 【蘇妹妹正妹便利店】男人喝茶Line:cai40...

素材版權

  • Princess PartyDesign: Rei
  • 幻想素材サイトFirst MoonSozai: 糸宇 睦月

標籤貼紙

  • Valid XHTML 1.0
  • Valid CSS 2.1
  • WCAG 1.0 Triple-A