書籤功能主要是幫助使用者快速的在整篇文章或網頁裡快速的到達想觀看的位置

在很多網頁中都能看到此功能

網頁最常使用的就是文章尾端或旁邊通常會有個[TOP]按鈕

點擊後即可移動到網頁上方

此功能的寫法只需幾個步驟即可完成

重點是透過程式實現此功能更沒什麼難度

概念就和在Word建立書籤一樣

 

Word做法:

1.選取要到達的文字->插入->書籤->輸入書籤名稱->確定

2.選取要觸發條件的書籤文字->超連結->書籤->選取建立的書籤->完成

接著點擊該書籤文字後,即可自動跳轉的原先建立的書籤位置

就像點擊網址後會跳轉到網站一樣

只不過我們可以設定他要跳轉到的位置在哪裡

以上是在Word建立書籤的方法,但透過PHP製作概念也是一樣的

 

PHP做法:

1.選取要到達位置的物件(文字.圖片..等皆可)並設定ID名稱

如:<img src="123.jpg" id="gotop" />

2.設定要執行動作的物件(文字.圖片..等皆可)並建立連結移動到指定位置

如:<a href="#gotop">top</a>

設定完後點擊top連結就會自動跳到步驟一設定的位置了

 

<img src="123.jpg" id="gotop" />

<div style="height:500px;"></div>
<a href="#gotop">TOP</a>
<div style="height:500px;"></div>
<a href="#gotop">TOP</a>

以上為簡單的範例說明

 

arrow
arrow
    文章標籤
    PHP 書籤功能 教學
    全站熱搜

    Randy 發表在 痞客邦 留言(0) 人氣()