?咨詢郵箱：
350分享淘寶裝修之雙層固定全屏海報的制作方法
發表日期：2020-08-31 09:55?? 文章編輯：350模板官網小編 ?? 瀏覽次數：
在淘寶店鋪裝修中，有一種特效非常的大氣時尚，那就是雙層全屏海報，其中底層是固定的，
不是隨著頁面的滾動而動，上層不是固定的，可以隨著頁面的滾動而動。
到底是什么樣的效果呢？大家可以看下幅動態圖：
那么如何實現這種效果呢？相信大家都已經蠢蠢欲動想要學了，
那么現在350裝修平臺就將詳細的操作教程公布給大家。
準備素材：
1.需要一張底部的圖片和一張局部透明的頂部圖片。
要求底圖大小是1920PX*737PX，頂圖大小是1920PX*666PX。
如果沒有的話您可以使用我們提供的現成的圖片操作試試。
圖片素材2.Dreamweaver 下載地址http://pan.baidu.com/s/1pJz68iB
特效代碼：
<div data-title="www.tbzxiu.com" style="height:645px;" class="vc2018"> <div class="footer-more-trigger" style="width:auto;border:none 0;padding:0;width:1920px;height:666px;border:none;padding:0;top:auto;left:auto;"> <div class="footer-more-trigger" style="width:auto;border:none 0;padding:0;width:1920px;height:666px;left:-485px;top:auto;border:none;padding:0;overflow:hidden;"> <div class="footer-more-trigger" style="width:auto;border:none 0;padding:0;height:666px;width:1920px;top:auto;left:auto;"> <div style="background-color:transparent;background-image:url(底部圖片地址);background-repeat:no-repeat;height:666px;width:1920px;background-repeat:no-repeat;background-position:center top;background-attachment:fixed;"> <div class="footer-more-trigge" style="width:auto;border:none 0;padding:0;left:0px;top:0px;width:1920px;height:666px;"> <div class="vc2018-box"> <div class="footer-more-trigger" style="z-index:99;width:auto;border:none 0;padding:0;white-space:nowrap;left:0px;top:0px;"> <div class="main"> <div> <p style="text-align:center;"> <img border="0" src="頂部圖片地址"> </p> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>
操作步驟：
在Dreamweaver（下面簡稱DW）中新建一個html頁面，切換到代碼視圖，并將其中的原有代碼刪除。
將上面的特效代碼復制到DW中，并將制作好的圖片素材上傳的您的淘寶圖片空間，并分別獲取兩張圖片的圖片地址，分別替換掉DW里的--底部圖片地址文字和頂部圖片地址文字。
替換圖片地址以后切換到設計視圖，可能圖片會顯示不出來，這個時候注意將剛才粘貼的兩張圖片地址前面的https://里的s刪掉就顯示出來了，如圖：
在設計視圖里看到圖片以后，用鼠標點下選中頂層圖片，然后在最下面看到屬性框，里面就有熱點工具：
用鼠標點中如上圖的熱點工具，您可以選擇矩形，圓形或者多邊形任其一種，連續在圖片中用鼠標按住左鍵畫出熱點區域，不過要注意的是：
每用鼠標在圖片中畫出一片熱點區域時，屬性框里便會出現這個熱點區域的屬性設置信息，您需要在里面填寫這個熱點相應的寶貝鏈接。
如下圖：
只有填寫的鏈接，點擊這塊區域才會跳轉到相應的寶貝詳情頁那里。
好了，制作好熱點以后，在DW里返回代碼視圖，將里面的代碼全部選中，然后復制粘貼到您的淘寶通欄自定義內容區里就可以了。
以上就是350裝修平臺為大家搜集整理的淘寶店裝修的辦法， 效果大家可以去試試哦。
標簽： ? ?
如沒特殊注明，文章均為350模板官網原創,轉載請注明來自http://www.daartisan.cn//zxzs/987.html