我工作的一些代码与bxslider,因为我有很多大的图像,页面加载缓慢,我试过任何lazy loading plugin
,但不适用于bxslider
。最后,我试图自己写一些代码。jquery删除attr然后添加attr
我试着做点什么,如果div is visible
,removeAttr data-style
,然后加addAttr style
。我在jsfiddle代码(略代码bxslider
):
<div class="bgAnchor" data-style="background:url('http://it.bing.com/az/hprichbg?p=rb%2fNewRiverGorgeBridge_ROW468427072.jpg') no-repeat;background-position:0px 0px;"></div>
<div class="bgAnchor" data-style="background:url('http://it.bing.com/az/hprichbg?p=rb%2fPalmFrond_ROW2095872384.jpg') no-repeat;background-position:0px 0px;"></div>
<div class="bgAnchor" data-style="background:url('http://it.bing.com/az/hprichbg?p=rb%2fJacksonSquare_ROW1364682631.jpg') no-repeat;background-position:0px 0px;"></div>
<div class="bgAnchor" data-style="background:url('http://it.bing.com/az/hprichbg?p=rb%2fAustraliaClouds_ROW1600390948.jpg') no-repeat;background-position:0px 0px;"></div>
$('.bgAnchor').each(function(){
if($(this).is(":visible")){
var data_style = $(this).attr('data-style');
if(data_style!== 'undefined' && data_style!== false){
var attr_image = $(this).attr("data-style");
$(this).css('background',attr_image).removeAttr("data-style");
}
}
});
,但我不知道为什么它不工作。如果有人能帮助我,我很高兴。非常感谢。
'data_style!== 'undefined''应该是'data_style!== undefined'或'typeof运算data_style!==' undefined''如果你喜欢令人讨厌丑陋的代码。 – 2012-02-23 17:12:39
如果您在$(document).ready()运行该代码,那么在文档完成加载完成之前可能不会触发该代码。 – Dave 2012-02-23 17:13:11
...和你的jsFiddle加载'MooTools'而不是'jQuery'。 – 2012-02-23 17:14:01