原文圖片:http://gsbtom.pixnet.net/blog/post/21745280
因為自己的blog是套用別人的樣本
加上又懶的學CSS設計
所以縱使有些想法要加入版面上
只能套用別人的範例
只是最近有個範例 讓我花了不少時間...
我的需求簡述應為以下兩點
1.利用blog已分類的各類文章 藉由類似"PCHome購物"的模式讓網友點選而連結至各分類
文章
所謂"PCHome購物"的模式就是想弄一個像我blog中的廣告樣式
有兩三個畫面像跑馬燈般切換
點選後則可以連結至設定的網頁中
檢示其語法 (語法位置)
發現似乎是用flash作成之頁面 (因為有.swf的連結網頁) 當然我也是懶得學
2.每一個畫面作成一個超連結 例:棒球一個畫面點選後進入歸類於棒球的文章 電影
美食...亦同
上網打上keyword查詢無所獲
再上奇模知識+發問也沒有得到滿意的回覆
突想到很久已前學網頁設計時一些特殊炫麗的頁面都是靠Java Script幫忙
終於在"爪哇島"找到最接近我需求的語法
貼上與大家分享
<script language="JavaScript1.2">
<!--
var marqueewidth=160
var marqueeheight=120
var speed=2
var marqueecontents='<center><P><a href="網頁1" target="_blank"><img src="圖片存放位置1" border=0 alt="笑話"></a><P><a href="網頁2" target="_blank"><img src="圖片存放位置2" border=0 alt="投資"></a></a></center>'
if (document.all)
document.write('<marquee direction="down" scrollAmount='+speed+' style="width:'+marqueewidth+';height:'+marqueeheight+'">'+marqueecontents+'</marquee>')
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (document.layers){
setTimeout("window.onresize=regenerate",160)
intializemarquee()
}
}
function intializemarquee(){
document.cmarquee01.document.cmarquee02.document.write(marqueecontents)
document.cmarquee01.document.cmarquee02.document.close()
thelength=document.cmarquee01.document.cmarquee02.document.height
scrollit()
}
function scrollit(){
if (document.cmarquee01.document.cmarquee02.top>=thelength*(-1)){
document.cmarquee01.document.cmarquee02.top-=speed
setTimeout("scrollit()",160)
}
else{
document.cmarquee01.document.cmarquee02.top=marqueeheight
scrollit()
}
}
window.onload=regenerate2
-->
</script>
<ilayer width=&{marqueewidth}; height=&{marqueeheight}; name="cmarquee01">
<layer name="cmarquee02" width=&{marqueewidth}; height=&{marqueeheight};></layer>
</ilayer>
</center>
只是還是有點未盡理想的地方
1.畫面不知如何調成跟圖片大小一樣(圖片160x120)會出現兩三張圖片同時出現
網站上提供注意事項僅有三點
在 var marqueewidth=150 中修改跑馬燈的寬度(請填寫最寬的)
在 var marqueeheight=50 中修改跑馬燈的高度
在 var speed=1 中修改跑馬燈的速度
依其調整似乎只有速度ok
2.畫面如跑馬燈接續而至 但當所有圖片都跑完會有些時間呈現空白
有辦法調整成一直接續下去不要間斷嗎?
--
吃喝玩樂讓生活更有動力 http://blog.pixnet.net/gsbtom
--
All Comments