快捷導(dǎo)航

jQuery實(shí)現(xiàn)的鼠標(biāo)經(jīng)過時(shí)變寬的效果(附demo源碼)

更新時(shí)間：2016年04月28日 11:30:56 作者：懶人

這篇文章主要介紹了jQuery實(shí)現(xiàn)的鼠標(biāo)經(jīng)過時(shí)變寬的效果,實(shí)例演示了jQuery的Kwicks插件實(shí)現(xiàn)針對(duì)鼠標(biāo)事件的響應(yīng)與頁(yè)面元素樣式動(dòng)態(tài)變換的相關(guān)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下

本文實(shí)例講述了jQuery實(shí)現(xiàn)的鼠標(biāo)經(jīng)過時(shí)變寬的效果。分享給大家供大家參考，具體如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
  <head>
    <title>Kwicks 1.5.1 Example Page</title>
    <!-- IMPORTANT!!! Include the stylesheet *BEFORE* the JavaScript (necessary for Safari 3.1.1) -->
    <link rel="stylesheet" type="text/css" href="css/main.css" />
    <script src="js/jquery-1.2.6.min.js" type="text/javascript"></script>
    <script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
    <script src="js/jquery.kwicks-1.5.1.pack.js" type="text/javascript"></script>
    <script type="text/javascript">
      $().ready(function() {
        $('.kwicks').kwicks({
          max : 220,
          spacing : 5
        });
      });
    </script>
  </head>
  <body>
    <ul class="kwicks horizontal" >
      <li id="kwick_1"></li>
      <li id="kwick_2"></li>
      <li id="kwick_3"></li>
      <li id="kwick_4"></li>
    </ul>
  </body>
</html>

完整實(shí)例代碼點(diǎn)擊此處本站下載。

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery切換特效與技巧總結(jié)》、《jQuery拖拽特效與技巧總結(jié)》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》、《jQuery動(dòng)畫與特效用法總結(jié)》、《jquery選擇器用法總結(jié)》及《jQuery常用插件及用法總結(jié)》

希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

jquery easyui combobox模糊過濾(示例代碼)
這篇文章主要介紹了jquery easyui combobox模糊過濾(示例代碼)。需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2013-11-11
jQuery動(dòng)態(tài)移除與增加onclick屬性的方法詳解
這篇文章主要介紹了jQuery動(dòng)態(tài)移除與增加onclick屬性的方法,結(jié)合實(shí)例形式分析了jQuery使用attr與removeAttr方法針對(duì)元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-06-06
jQuery取id有.的值的方法
用jQuery取值，當(dāng)一個(gè)id中含有.時(shí)，這個(gè)時(shí)候正常的取法是做不到的，因此請(qǐng)看下文
2014-05-05
a標(biāo)簽跳轉(zhuǎn)到指定div,jquery添加和移除class屬性的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猘標(biāo)簽跳轉(zhuǎn)到指定div,jquery添加和移除class屬性的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-10-10
jquery實(shí)現(xiàn)彈出層完美居中效果
本篇文章主要是對(duì)jquery彈出層居中效果的簡(jiǎn)單實(shí)例進(jìn)行了介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2014-03-03
23個(gè)超流行的jQuery相冊(cè)插件整理分享
本文羅列了23款目前非常受歡迎的jQuery插件，可以輕松建立起唯美的圖片切換特效的相冊(cè)功能，并且其中的一些還支持視頻和Flash。
2011-04-04
jQuery Collapse1.1.0折疊插件簡(jiǎn)單使用
這篇文章主要介紹了jQuery Collapse1.1.0折疊插件的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-08-08
jQuery 如何先創(chuàng)建、再修改、后添加DOM元素
這篇文章主要介紹了jQuery 如何創(chuàng)建、修改、添加DOM元素,需要的朋友可以參考下
2014-05-05
jQuery+ajax實(shí)現(xiàn)用戶登錄驗(yàn)證
這篇文章主要為大家詳細(xì)介紹了jQuery+ajax實(shí)現(xiàn)用戶登錄驗(yàn)證，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-09-09
jQuery實(shí)現(xiàn)選中行變色效果(實(shí)例講解)
下面小編就為大家?guī)硪黄猨Query實(shí)現(xiàn)選中行變色效果(實(shí)例講解)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-07-07