1

誰かがこのコードが機能しない理由を理解するのを手伝ってもらえますか？

$('#quick-search-header.widget-title').css('background-image', 'url(dd_includes/images/icons/sliding-menu-arrow-right.gif)');

Firebugを通して、background-imageがから完全に削除されていることがわかります#quick-search-header.widget-titleが、上の新しい背景画像がに追加されていelement.styleます。ありがとう。

HTML-

<div id="quick-search-header" class="widget-title">
    <p>Quick search results</p>
</div>

CSS-

#quick-search-header.widget-title{
    background: #C60B46 url(dd_includes/images/icons/sliding-menu-arrow-down.gif) right 3px no-repeat;
}

フルJS（エラーコードがマークされています）-

$(document).ready(function(){

    $('input#s').val('');

    $('#quick-search-header.widget-title').live('click', function(){

        if($('#quick-search-content').hasClass('visible')){

            $('#quick-search-header.widget-title').css('background-image', 'url(dd_includes/images/icons/sliding-menu-arrow-right.gif)'); /** Not working */
            $('#quick-search-content').removeClass('visible')
            $('#quick-search-content').slideUp('600');

        } else {

            $('#quick-search-header.widget-title').css('background-image', 'url(dd_includes/images/icons/sliding-menu-arrow-down.gif)'); /** Not working */
            $('#quick-search-content').addClass('visible')
            $('#quick-search-content').slideDown('600');

        }

    });

});
4

3 に答える 3

4

  1. 相対パスが正しいことを確認してください。現在の場所に対する相対パスの10倍を確認します。javascript：

    window.location.pathname

  2. 試してみてください： 最初にcssを次のように定義します：

    .XXX {background-image：url（）}

次にjavaScriptで：

backgroundImage = "url（'../ images / image.png'）"; //一重引用符に注意してください

$（XXX）.css（ "background-image"、backgroundImage）;
//または
$（XXX）.css（{"background-image"：backgroundImage}）;

于 2012-11-22T16:36:49.763 に答える
4

jQueryの関数を介して値を設定するcss('attributename','attributevalue')と、その属性が要素のインラインスタイルに追加されます。インスペクターでは、しばしばラベル付けされたelement.style

クラスを介してのみこれを行う必要がある場合は、代替の背景画像を使用して別のクラスを作成し、要素からクラスを追加/削除することでクラスを切り替えることができます。これはelement.styleに表示されず、単にクラスとそれは代わりにインスペクターに表示されます。

toggleClass()特定のクラスまたは複数のクラスのオンとオフを切り替えることができる関数を使用することもできます。

ドキュメントは次のとおりです。

トグルクラス

addClass

removeClass

または、を使用して要素に属性を設定することでそれを行うこともできます.attr('class','newClassName');

君による。

于 2012-07-17T14:25:04.620 に答える
0

試す;

$('#quick-search-header.widget-title').css({'background-image':'url(dd_includes/images/icons/sliding-menu-arrow-right.gif)'});

お役に立てれば...:)

于 2012-07-17T14:34:33.487 に答える