相关疑难解决方法(0)

一旦更新到jQuery,我就会收到jQuery的错误v3.0.0.

jquery.js:9612 Uncaught TypeError: url.indexOf is not a function

任何想法为什么？

我有一个侧边栏小部件,具有图像背景.

这是一个搜索输入表单.我不希望输入在图像加载之前显示.

有没有办法将load事件处理程序附加到CSS背景图像,如普通的img元素/对象？

我知道这可以在普通图像上完成,但我想将它保留为CSS背景,因为图像是精灵的一部分.我使用的是jQuery,因此使用jQuery或plain DOM JS的解决方案同样出色.

有没有办法,使用jQuery,在加载CSS背景图像时触发事件？

我有一个使用外部CSS加载的外部背景图像的Web应用程序.现在,可以在图像完全渲染之前使用应用程序,从而创建奇怪的视觉效果.

如何在图像完全加载之前暂停脚本执行？

它可以使用普通的JavaScript或jQuery.因为图像是在外部CSS中加载的,所以我读过的正常触发器不起作用.

我正在尝试下载图像,然后使用css应用淡入淡出background-image.
我可以在这样的常规时完成这个<img src=''/>:

#mainImg {display:none}

var c = $('#mainImg');
$(new Image()).load(function(){
    c.fadeIn(300);
}).attr('src', c.attr('src'));

但是,当它是一个时,我怎么能检测到它css background呢？
这里是使用jQuery的CSS,但我似乎无法像上面的代码那样得到它并检测下载何时完成

$('<img/>').attr('src', 'image.png').load(function() {
     $('#mainImg').css('background-image', 'url(image.png)');
});

编辑这帮了! 如何检查是否加载了背景图像？ 谢谢@colin

我正在实现一个网站,我想在点击时更改背景图像,但很容易,如淡出淡出等等.

onclick部分是用Jquery实现的,但我正在努力解决缓动部分问题.

我在网上搜索过这个,但是每个解决方案都只在页面的一小部分使用div.

对我来说问题是我使用这些div作为一个整页,100%的宽度和高度,我有内容在div前面.

我想过使用精灵和背景位置的动画,但这没有帮助,因为我希望我的页面有响应,我有背景网址的百分比和精灵需要你声明固定的宽度(如果我错了,纠正我).

另外我必须在div后面添加另一个div,所以改变不透明度解决方案无能为力.我正在实施这样的网站:http://www.samsung.com/global/microsite/galaxynote3-gear/

HTML:

<div class="Page" id="feauture3">
    <div id="feauture3_content">
        <div id="feauture3_1"><strong>Menu1</strong></div>
        <div id="feauture3_2"><strong>Menu2</strong></div>
        <div id="feauture3_3"><strong>Menu3</strong></div>
        <div id="feauture3_4"><strong>Menu4</strong></div>
    </div>
</div>

CSS:

#feauture3_1:hover {
        background-color:#f2af95;
        cursor:pointer;
}

#feauture3_2:hover {
        background-color:#f2af95;
        cursor:pointer;
}

#feauture3_3:hover {
        background-color:#f2af95;
        cursor:pointer;
}

#feauture3_4:hover {
        background-color:#f2af95;
        cursor:pointer;
}

#feauture3 {
        position: fixed;
        height: 100%;
        width: 100%;
        background: url('http://www.asphaltandrubber.com/wp-content/gallery/2013-kawasaki-ninja-z800-z800e/2013-kawasaki-ninja-z800-02.jpg') 50% 50% no-repeat;
        left:0; 
        background-size: cover;
        background-color:#e18764;
        color:red;
}

jQuery的:

jQuery(document).ready(function($){
       $("#feauture3_1").click(function(){
       $("#feauture3").css('background-image','url("http://www.motorcyclespecs.co.za/Gallery%20B/Kawasaki%20Ninja%20650R%2013.jpg")');
    });

    $("#feauture3_2").click(function(){
        $("#feauture3").css('background-image','url("http://images5.fanpop.com/image/photos/31700000/HOT-BABE-KAWASAKI-Z1000-motorcycles-31778270-1920-1200.jpg")')
    });

    $("#feauture3_3").click(function(){
        $("#feauture3").css('background-image','url("http://b296d35169b22ec514a7-3f0e5c3ce41f2ca4459ddb89d451f8d9.r21.cf2.rackcdn.com/wp-content/uploads/2012/11/Kawasaki-Z1-by-Ac-Sanctuary-.jpg")')
    });

    $("#feauture3_4").click(function(){
        $("#feauture3").css('background-image','url("http://4.bp.blogspot.com/-ar4zyO_Ws4M/UekF8jk7nRI/AAAAAAAA1q4/ugQZlRGTLkk/s1600/Kawasaki-Z-1000-.jpg")')
    });

}); …

我通过 css property 加载图像background，而不是使用src属性。但在这种情况下，alt文本也会显示出来。如何停止显示alt文本并仅在图像未加载时才显示

.test {
  display: block;
  width: 200px;
  height: 82px;
  background-size: 200px 82px;
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQJr81CRJeZGFiBsA9_AOyyxegiIPctdcbNfHThnpnclmFH-mJwoQ");
}

<img class="test" alt="My background image">