菊花轉動的jquery加載動畫效果
更新時間：2018年08月19日 11:18:12 作者：酷jjs
我們這次給大家?guī)淼氖顷P于用jquery實現(xiàn)菊花轉動的加載動畫效果，以及相關實例代碼，有興趣的朋友可以學習下。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link charset="utf-8" href="css/reset.css" rel="external nofollow" rel="stylesheet">
<link charset="utf-8" href="css/main.css" rel="external nofollow" rel="stylesheet">
<style>
.box{width:200px;height:200px;background:#000000;}
.xxloading{width:100%;height:100%;background:rgba(255,255,255,0.2);}
.xxloading .xximg{width:100%;height:100%;background:url("../img/ico/loading2.gif") no-repeat center;}
</style>
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/mychajian.js"></script> <!-- 添加jq的loading插件-->
</head>
<body>
<div class="box"></div>
<script>
$(function () {
$(".box").myloading(); //執(zhí)行l(wèi)oading動畫
});
</script>
</body>
</html>
mychajian.js的插件內容：
;(function($){
$.fn.extend({
myloading:function(obj){
var str=[" <div class=\"xxloading\">",
" <div class=\"xximg\"></div>",
" </div>"].join("");
return this.append(str);
}
});
})(jQuery);
效果圖顯示：
相關文章
今天針對這個JQuery里面的toggle聊幾句，文章中涉及到了一些問題望牛牛們能幫忙解惑一下。2009-11-11
這篇文章主要介紹了小編日常收集整理的關于jQuery中常用動畫效果函數(shù)的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-09-09
jQuery form 表單驗證插件(fieldValue)校驗表單
這篇文章主要介紹了jQuery form 表單驗證插件(fieldValue)校驗表單的相關資料,需要的朋友可以參考下2016-01-01
這篇文章主要介紹了jQuery操作選中select下拉框的值代碼實例,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-02-02
這篇文章主要介紹了使用jquery中height()方法獲取各種高度大全,比如瀏覽器高度、可視窗口高度、文檔高度等,需要的朋友可以參考下2014-04-04
這篇文章主要為大家詳細介紹了jQuery實現(xiàn)可以計算進制轉換的計算器，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-10-10
jQuery Flash/MP3/Video多媒體插件,主要是用來加載flash或mp3等網絡媒體文件。2010-01-01
在網頁中我們經常會用到無縫輪播左右循環(huán)效果，今天腳本之家小編給大家?guī)砹嘶趈Query實現(xiàn)無縫輪播與左右點擊效果 ，感興趣的朋友參考下吧2018-05-05
jquery 面包屑導航 具體實現(xiàn)，需要的朋友可以參考一下2013-06-06
AJAX 是一種用于創(chuàng)建快速動態(tài)網頁的技術。這篇文章主要介紹了基于jQuery的ajax方法封裝的相關資料,需要的朋友可以參考下2016-07-07