jquery画像のプリロード自動比例スケーリングプラグイン_jquery

WBOY
リリース: 2016-05-16 18:57:09
オリジナル
845 人が閲覧しました
コードをコピー コードは次のとおりです:

/*
******* *** ****画像プリロード プラグイン*****************
///作成者: Wu Jian (2008-06-23)
// /http://regedit.cnblogs.com

///説明: 画像をロードする前にロードサインを表示し、画像をダウンロードした後に画像を表示します
画像を自動的にズームできます
このプラグインを使用すると、最初にページを読み込み、後で画像を読み込むことができます。
画像を表示した後に拡大する前にレイアウトを展開する必要がある問題を解決します。
/ /パラメータ設定:
スケーリング 自動的に均等な比率で拡大縮小するかどうか
width 画像の最大高さ
height 画像の最大幅
読み込み画像のloadpicパス
*/
jQuery.fn.LoadImage=function(scaling,width ,height,loadpic){
if(loadpic==null)loadpic="load3.gif";
return this.each(function(){
var t=$(this);
var src=$(this).attr("src")
var img=new Image();
//alert("Loading")
img.src=src;
// 画像を自動的に拡大縮小します
var autoScaling=function(){
if(scaling){

if(img.width>0 && img.height> 0){
if(img.width /img.height>=width/height){
if(img.width>width){
t.width(width); ((img.height*width)/img.width);
t.width(img.width)
t.height(img.height); >}
else{
if (img.height>height){
t.height(height);
t.width((img.width*height)/img.height); 🎜>}else{
t.width (img.width);
t.height(img.height)
}
}
}
}
//画像のキャッシュ処理時に自動的に読み込まれます
if(img.complete){
//alert("getToCache!");
autoScaling(); 🎜>}
$(this).attr ("src","");
varloading=$("読み込み中");

t.after(loading);
$(img).load(function(){
autoScaling();
loading.remove();
t.attr("src",this.src);
//alert("やっと!")
} );

}) ;
}


使用説明:
$("div img").LoadImage(true,120,90); >効果は次のとおりです:
テストアドレス
http://img.jb51.net/online/jqueryLoadImage/demo.htm




ファイルパッケージのダウンロード
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!