好玩的語法~點圖換圖特效可放在部落格

可以一次把多張圖片利用切換效果放在同一張位置上

請選用同一大小的圖片 點圖片觀看換圖效果　↓　















 

語法中利用 a name="01" 顯示第一張圖片

利用 href="#02" 連結到第二張圖片切換

以此類推

語法如下:

<DIV style="width: 圖寬度px; height: 圖高度px"><DIV style="overflow: hidden; width: 圖寬度px; height: 圖高度px; float: left; position: relative">
<br>
<a name="01" href="#02"><img src="第一張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="02" href="#03"><img src="第二張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="03" href="#04"><img src="第三張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="04" href="#05"><img src="第四張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="05" href="#06"><img src="第五張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="06" href="#07"><img src="第六張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="07" href="#08"><img src="第七張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<br>
<a name="08" href="#09"><img src="第八張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="09" href="#10"><img src="第九張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="10" href="#11"><img src="第十張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="11" href="#12"><img src="第十一張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<a name="12" href="#13"><img src="第十二張圖網址" width="圖寬度" border="0" alt=""""""""" 點圖換圖 "></a>
<br>
<div style="width: 圖寬度px; height: 圖高度px"><a name="13" href="#01"><img src="第十三張圖網址" width="圖寬度" border="0" alt="""""點圖換圖"""" "></a></div>
</DIV></DIV>

 

 

 

arrow
arrow
    文章標籤
    width alt br name src href border img div px
    全站熱搜

    vemma維瑪珉珉Min 發表在 痞客邦 留言(0) 人氣()