5
में fadein विधि बुला रहा है
वहाँ एक प्लगइन से एक रेखा है कि मैं कि im कोशिश कर उपयोग कर रहा हूँ समझने के लिए है:समझ में नहीं आता कि यह कैसे Jquery
$self.hide().attr("src", $self.data(settings.data_attribute))[settings.effect](settings.effect_speed);
स्वयं एक jQuery वस्तु है, जो इस में कोड एक आईएमजी डोम तत्व है, यह इसे छुपाता है, फिर इस आईएमजी ऑब्जेक्ट की src विशेषता को html5 डेटा-एट्रिब्यूट में सेट करता है। लेकिन अब यह jattery ऑब्जेक्ट में एक संपत्ति तक पहुंच रहा है .attr द्वारा लौटाया गया है (जो कि इसमें "फीडइन" है। लेकिन मुझे समझ में नहीं आ रहा है, क्या jquery ऑब्जेक्ट्स ने बनाया है जहां एक प्रभाव संपत्ति फ़ंक्शन jquery ऑब्जेक्ट में बनाया गया है? मैं उलझन में हूँ यह कैसे कॉल करने के लिए अनुवाद किया जाता है। फेडइन (900)। मुझे यह jquery वेबसाइट पर कहीं भी दस्तावेज नहीं मिल रहा है। अगर कोई इस पर कुछ प्रकाश डाल सकता है, तो धन्यवाद।
क्षमा करें, यह पूरा कोड है, यह मिका tuupola के आलसी लोड हो रहा है jQuery प्लगइन से है:
(function($, window, document, undefined) {
var $window = $jq191(window);
$jq191.fn.lazyload = function(options) {
var elements = this;
var $container;
var settings = {
threshold : 0,
failure_limit : 0,
event : "scroll",
effect : "show",
container : window,
data_attribute : "original",
skip_invisible : true,
appear : null,
load : null
};
function update() {
var counter = 0;
elements.each(function() {
var $this = $jq191(this);
if (settings.skip_invisible && !$this.is(":visible")) {
return;
}
if ($jq191.abovethetop(this, settings) ||
$jq191.leftofbegin(this, settings)) {
/* Nothing. */
} else if (!$jq191.belowthefold(this, settings) &&
!$jq191.rightoffold(this, settings)) {
$this.trigger("appear");
/* if we found an image we'll load, reset the counter */
counter = 0;
} else {
if (++counter > settings.failure_limit) {
return false;
}
}
});
}
if(options) {
/* Maintain BC for a couple of versions. */
if (undefined !== options.failurelimit) {
options.failure_limit = options.failurelimit;
delete options.failurelimit;
}
if (undefined !== options.effectspeed) {
options.effect_speed = options.effectspeed;
delete options.effectspeed;
}
$jq191.extend(settings, options);
}
/* Cache container as jQuery as object. */
$container = (settings.container === undefined ||
settings.container === window) ? $window : $jq191(settings.container);
/* Fire one scroll event per scroll. Not one scroll event per image. */
if (0 === settings.event.indexOf("scroll")) {
$container.bind(settings.event, function(event) {
return update();
});
}
this.each(function() {
var self = this;
var $self = $jq191(self);
self.loaded = false;
/* When appear is triggered load original image. */
$self.one("appear", function() {
if (!this.loaded) {
if (settings.appear) {
var elements_left = elements.length;
settings.appear.call(self, elements_left, settings);
}
$jq191("<img />")
.bind("load", function() {
$self
.hide()
.attr("src", $self.data(settings.data_attribute))
[settings.effect](settings.effect_speed);
self.loaded = true;
/* Remove image from array so it is not looped next time. */
var temp = $jq191.grep(elements, function(element) {
return !element.loaded;
});
elements = $jq191(temp);
if (settings.load) {
var elements_left = elements.length;
settings.load.call(self, elements_left, settings);
}
})
.attr("src", $self.data(settings.data_attribute));
}
});
/* When wanted event is triggered load original image */
/* by triggering appear. */
if (0 !== settings.event.indexOf("scroll")) {
$self.bind(settings.event, function(event) {
if (!self.loaded) {
$self.trigger("appear");
}
});
}
});
/* Check if something appears when window is resized. */
$window.bind("resize", function(event) {
update();
});
/* With IOS5 force loading images when navigating with back button. */
/* Non optimal workaround. */
if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) {
$window.bind("pageshow", function(event) {
if (event.originalEvent.persisted) {
elements.each(function() {
$jq191(this).trigger("appear");
});
}
});
}
/* Force initial check if images should appear. */
$jq191(window).load(function() {
update();
});
return this;
};
/* Convenience methods in jQuery namespace. */
/* Use as $jq191.belowthefold(element, {threshold : 100, container : window}) */
$jq191.belowthefold = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = $window.height() + $window.scrollTop();
} else {
fold = $jq191(settings.container).offset().top + $jq191(settings.container).height();
}
return fold <= $jq191(element).offset().top - settings.threshold;
};
$jq191.rightoffold = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = $window.width() + $window.scrollLeft();
} else {
fold = $jq191(settings.container).offset().left + $jq191(settings.container).width();
}
return fold <= $jq191(element).offset().left - settings.threshold;
};
$jq191.abovethetop = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = $window.scrollTop();
} else {
fold = $jq191(settings.container).offset().top;
}
return fold >= $jq191(element).offset().top + settings.threshold + $jq191(element).height();
};
$jq191.leftofbegin = function(element, settings) {
var fold;
if (settings.container === undefined || settings.container === window) {
fold = $window.scrollLeft();
} else {
fold = $jq191(settings.container).offset().left;
}
return fold >= $jq191(element).offset().left + settings.threshold + $jq191(element).width();
};
$jq191.inviewport = function(element, settings) {
return !$jq191.rightoffold(element, settings) && !$jq191.leftofbegin(element, settings) &&
!$jq191.belowthefold(element, settings) && !$jq191.abovethetop(element, settings);
};
/* Custom selectors for your convenience. */
/* Use as $jq191("img:below-the-fold").something() or */
/* $jq191("img").filter(":below-the-fold").something() which is faster */
$jq191.extend($jq191.expr[':'], {
"below-the-fold" : function(a) { return $jq191.belowthefold(a, {threshold : 0}); },
"above-the-top" : function(a) { return !$jq191.belowthefold(a, {threshold : 0}); },
"right-of-screen": function(a) { return $jq191.rightoffold(a, {threshold : 0}); },
"left-of-screen" : function(a) { return !$jq191.rightoffold(a, {threshold : 0}); },
"in-viewport" : function(a) { return $jq191.inviewport(a, {threshold : 0}); },
/* Maintain BC for couple of versions. */
"above-the-fold" : function(a) { return !$jq191.belowthefold(a, {threshold : 0}); },
"right-of-fold" : function(a) { return $jq191.rightoffold(a, {threshold : 0}); },
"left-of-fold" : function(a) { return !$jq191.rightoffold(a, {threshold : 0}); }
});
}) ($ jq191, खिड़की, दस्तावेज़);
क्या पूरा कोड कहीं भी उपलब्ध है? – jgillich