依據行動裝置顯示對應網頁效果
隨著越來越多人使用 iPad iPhone 或者 Android 手機與平板電腦上網
各大網站設計與知名企業網站也紛紛提供專屬行動裝置網頁
其實
透過最新的智慧型手機或平板電腦的瀏覽器，依樣可以正常瀏覽各大網站
，但是與一班電腦螢幕相比，由於手機與平板的螢幕尺寸與解析度都有不小差距
使用者常常需要使用手指重複不斷縮放瀏覽網頁內容
這對於使用者來說實在很不方便
能夠讓網頁依據使用者裝置顯示不同的版面效果
許多書籍都介紹使用 CSS+DIV 所喔這裡我就不加介紹
現在 提供一個 比較簡單的方式來製作~~~
使用 JAVASCRIPT語言 來偵測電腦螢幕解析度，導向對應的網頁版版本
例如：手機使用者進入雞蛋貓部落格後，會自動導向 手機板的雞蛋貓部落格網址。
只要將此語法 貼入到 網頁程式碼<head></head>標籤內即可
<script type="text/javascript">
<!--
function mymedia(){
var myscreen=screen.availWidth;
if(myscreen<321){document.location.href="手機網頁";return;}
if(myscreen<769){document.location.href="平板網頁";return;}
}
mymedia();//呼叫執行自訂函數
//-->
</script>
全站熱搜
留言列表
