jQuery隱藏與顯示所要展現的區塊

在網頁上常使用按下指定的按鈕(或區塊)後,jQuery隱藏與顯示所要展現的區塊,此方法可以使用jQuery click slideToggle 簡單的實現。

Comment

jQuery捲軸滑動區塊的判斷,網頁上常看到應用在廣告區塊上,讓使用者在滑下遊覽器捲軸時,到此區塊廣告的高度的後,並能夠將畫面上的廣告區塊能夠在此時畫面固定住,然而離開這個卷軸高度廣告區塊又能夠還原在原來區塊不固定。

Comment

jQuery cookie應用方法

jquery.cookie.js 一個輕量級的cookie 插件,可以讀取、寫入、刪除cookie。

對cookies的操作在當訪問一個網站就無時無刻的都伴隨著我們,記錄著我們的一舉一動,並將不危害用戶隱私的信息,將以保存,這樣用戶就不用去從新再次操作重複的步驟,這樣大大方便了客戶,也增加了客戶對網站的回頭率。

jquery.cookie.js 提供了jquery中非常簡單的操作cookie的方法。

$.cookie('the_cookie'); // 獲得cookie
$.cookie('the_cookie', 'the_value'); // 設定cookie
$.cookie('the_cookie', 'the_value',{path:'/'}); // 設定cookie為整個網站有效
$.cookie('the_cookie', 'the_value', { expires: 7 }); //設定cookie有效時間7天
$.cookie('the_cookie', '', { expires: -1 }); // 删除
$.cookie('the_cookie', null); // 删除 cookie
$.cookie('the_cookie', 'the_value', {expires: 7, path: '/', domain: 'jquery.com', secure: true});//新建一個cookie 包括有效期 路徑 域名等

Comment

Javascript可以使用getElementsById setAttribute來做到跟改html元素屬性方法如下:

範例一

<img id="images" src="/ucamc/" width="100"> 
<scritp> 
  document.getElementsById("images").setAttribute("width", "200"); 
<script>
 //執行結果 <img id="images" src="/ucamc/" width="200">

範例二

<!DOCTYPE html>
<html>
<head>
<style>
.democlass {
    color: red;
}
</style>
</head>
<body>

<h1>Hello World</h1>

<p>Click the button to add a class attribute with the value of "democlass" to the h1 element.</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
    document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
}
</script>

</body>
</html>

 

相關連結展示:http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_element_setattribute1

Comment

jQuery .resize()

jQuery $(window).resize 視窗被調整過時,運行此函數,再使用$(window).width()取得目前遊覽器視窗寬度。若要取得的是遊覽器高度可改用$(window).height()。

$(document).ready(function(){
    $(window).resize(function() {
        var wdth=$(window).width();
        $("span").text(wdth);
    });
});

Comment

Copyright © 2018 ucamc