jQuery-plugin-wow

用法整理

- 下载地址:https://github.com/matthieua/WOW

- 参考文档:http://mynameismatthieu.com/WOW/docs.html

能实现按对应的元素按特定的效果出现在页面上,依据animate.css

<div class="wow bounceInUp">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
        consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
        cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
        proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    </div>
    <div class="wow slideInRight">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
        consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
        cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
        proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    </div>
<link rel="stylesheet" type="text/css" href="../css/libs/animate.css">
    <script type="text/javascript" src="wow.js"></script>
    <script>
              new WOW().init();
              </script>
</head>
时间: 2024-10-09 21:41:11

jQuery-plugin-wow的相关文章

jQuery ui widget和jQuery plugin的实现原理简单比较

一.创建 1.  jQuery plugin (function($){ $.fn.MyPlugin=function(){ //js代码 } })(jQuery) 为了与页面上其他代码友好相处,将plugin定义在一个闭包里,MyPlugin是plugin的名字.调用方式:$('选择器').MyPlugin(); 2.  jquery ui widget (function($){ $.widget('ui.mywidget',{ options:{ //默认的配置参数 }, //方法的定义

Jquery Plugin模版

1. [代码][JavaScript]代码 01// remember to change every instance of "pluginName" to the name of your plugin!02// the semicolon at the beginning is there on purpose in order to protect the integrity03// of your scripts when mixed with incomplete obje

The ultimate jQuery Plugin List(终极jQuery插件列表)

下面的文章可能出自一位奥地利的作者,  列出很多jQuery的插件.类似的网站:http://jquerylist.com/原文地址: http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/ jQuery is definitely my favourite Javascript Library and this ultimate jQuery Plugin List is for all oth

Native Fullscreen JavaScript API (plus jQuery plugin)

http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/ HTML5 <video> is great, but when it was first released, one of the big complaints was that it couldn’t do true FullScreen like Flash. Thankfully, this is changing and native F

[jQuery] 自做 jQuery Plugin - Part 1

有時候寫 jQuery 時,常會發現一些簡單的效果可以重複利用.只是每次用 Copy & Paste 大法似乎不是件好事,有沒有什麼方法可以讓我們把這些效果用到其他地方呢? 沒錯,就是用 jQuery 的 Plugin 機制. 不過 jQuery 的 Plugin 機制好像很難懂?其實一點也不.以下我用最簡單的方式來為大家解說如何自製一個簡單的 Plugin . 當然在此之前,你得先瞭解 JavaScript 的 class . object . variables scope 還有 anony

Eclipse jQuery plug-in(自动补全)

1,Eclipse 安装 spket 插件.( 两种方式):  在线安装:Help->Install New Software...->Add...->Name: "Spket", Location: http://www.spket.com/update/   下载完毕重启 Eclipse .  手动安装:到http://www.spket.com/download.html  下载 Plugin 版本,当前版本为1.6.17.下载解压后直接放置于Eclipse 的

jQuery plugin items filter

最近在Github上找到一款不错的过滤/筛选插件,类似jQuery UI的slider组件,不多说,上例子. jQuery UI app.js function showProducts(minPrice, maxPrice) { $("#products li").hide().filter(function() { var price = parseInt($(this).data("price"), 10); return price >= minPri

JQuery Plugin 开发

jquery 中有2个重要的API是和插件编写相关的. jQuery.extend(object)    即 $.extend(object) 这个函数是用来扩展 jQuery 本身, 也就是扩展 "$" 的. jQuery.fn.extend(object) 即 $.fn.extend(object) 这个函数用来为 jQuery 对象提供新的方法. 所谓 jQuery 对象, 最常见的我们平时通过jQuery选择器获取的对象, 比如: $("#id"), $(&

jQuery - plugin 代码模型

1.扩展 jQuery 的全局函数,主要以 $.xxx() 的形式调用 (function($) { $.myFunction = function(array) { // code } })(jQuery); 在外部可以这样调用 $.myFunction(...),但是,最好把自定义的全局函数放在自己的命名空间中,如下, (function($) { $.myNameSpace = { sum: function(array) { // code }, average: function(ar

JQuery Plugin serials (1)--- Harvest Chosen

一.Download harvest chosen from github https://github.com/harvesthq/chosen/ 二.在页面引用 @using (Html.BeginForm()) { <fieldset> <legend>Multi-Select Demo</legend> <div class="editor-field"> @Html.ListBox("Countries",