[網頁設計]請教一下這種連結效果要如何製作

wing52161
個人積分：0分
文章編號：11836383

0分

樓主

2009-05-07 18:46

麻煩請各位知道的先進教一下小弟謝謝

請問如何製作出:

如果圖片上1.2.3為按鈕

它分別連結圖片1-1,1-2,1-3

分別點1.2.3時

如何分別在A區域顯示出圖片1-1,1-2,1-3

但不影響或覆蓋B區域

小弟的問題是圖片上版面的配制已經完成

圖片也上傳完成了

但不知道如何讓它在A區域顯示出來

主要是要讓圖片1-1,1-2,1-3出現在同一頁且限制在A的範圍內

請問要如何製作它的語法小弟用的是frontpage 謝謝各位

[網頁設計]請教一下這種連結效果要如何製作

2009-05-07 18:46 發佈

文章關鍵字網頁設計連結效果

虎斑笨貓

虎斑笨貓
個人積分：28分
文章編號：11837530

28分

2樓

2009-05-07 20:15

方法一:切frame
方法二:用javascrip

r803405

r803405
個人積分：74分
文章編號：11837805

74分

3樓

2009-05-07 20:35

虎斑笨貓 wrote:
方法一:切frame...(恕刪)

方法三:用FLASH

抽離複雜回歸原始

抽離複雜回歸原始
個人積分：12分
文章編號：11837875

12分

4樓

2009-05-07 20:40

CSS也可以.......

一生尋找什麼

wing52161

wing52161
個人積分：0分
文章編號：11838249

0分

樓主

2009-05-07 21:05

先謝謝各位的回覆因為小弟沒有製作網頁的經驗跟基礎

也只有使用過frontpage 想要先確定的是

上面提出的效果是否frontpage 可以做到

是否要架設一個虛擬網站還是只要有圖片連結加上語法就好了

還是一定要用其他程式呢?像各位說的javascrip.FLASH

謝謝各位的回覆

ffeng

ffeng
個人積分：7分
文章編號：11838561

7分

6樓

2009-05-07 21:28

wing52161 wrote:
先謝謝各位的回覆因...(恕刪)

用什麼都無所謂，notepad 就可以了！

1) 先用 css 把按鈕區、a區、b區做出來 (用div)
2) 在a區放一個 img，需設定 id
eg. < img src="1-1.jpg" id="myImg" >

3) 寫一個要換圖用的 javascript function，用 getElementById 去找到 img，然後置換圖檔 src
function switchImg(fn)
{
var img = document.all ? document.all["myImg"] : document.getElementById("myImg");
img.src = fn;
}

4) 1、2、3 按鈕各設定 onclick 去跑物驟3的 javascript function，把圖檔位置及名字用 parameter 傳進去
eg. <input type="button" value="按鈕二" onClick="switchImg('1-2.jpg');">

完工

Canon 40D→5D→5D II、Nikon F5→Fuji X-Pro2

抽離複雜回歸原始

抽離複雜回歸原始
個人積分：12分
文章編號：11841297

12分

7樓

2009-05-07 23:39

ffeng wrote:

用什麼都無所謂，...(恕刪)

大大人真好，大大是程式設計，還是網頁設計？

用javascript，會不會因為瀏覽者關掉java而失效呢

一生尋找什麼

wing52161

wing52161
個人積分：0分
文章編號：11855365

0分

樓主

2009-05-08 18:03

ffeng wrote:

用什麼都無所謂，...(恕刪)

謝謝f大的回應

我大概知道製作方向了

如果有問題再請教您感謝

ffeng

ffeng
個人積分：7分
文章編號：11934678

7分

9樓

2009-05-13 6:12

抽離複雜回歸原始 wrote:

ffeng wro...(恕刪)

拍勢…有點 lag 了…哈哈
我兩個都有做…

當然如果使用者把 javascript 關掉的話…一切就失效了 orz

Canon 40D→5D→5D II、Nikon F5→Fuji X-Pro2