Question

我有一个新手问题。

我正在尝试显示a元素的背景图像。在鼠标悬停时，图片应更改为不同的图片。问题是图片没有显示。当我在CSS中使用代码时它工作得很好，所以它必须是我的函数才能产生问题。

我的代码：

jQuery(document).ready(function($){
    $(document).ready(function() {
        $(".person").css({background-image: url('<?php echo get_stylesheet_directory_uri(); ?>/img/person.jpg')});
        $(".person").mouseover(function() {
            $(this).css({background-image: url('<?php echo get_stylesheet_directory_uri(); ?>/img/person-hover.jpg')});    
        });      
    });
    var body = $( 'body' );
});

HTML：

<div class="silhoulettes">
    <a class="person" href="<?php echo get_permalink(41); ?>"></a>
</div>

。之间有一些php wordpress函数。

非常感谢你！

Answer 1

通过jQuery给出css的正确方法是css("propertyname","value");和css({"propertyname":"value","propertyname":"value",...});多种风格。

试试这个

$(".person").css({"background-image"," url('<?php echo get_stylesheet_directory_uri(); ?>'/img/person.jpg")});
$(".person").mouseover(function() {
     $(this).css({"background-image", "url('<?php echo get_stylesheet_directory_uri(); ?>'/img/person-hover.jpg")});    
 });

所做的更改

$(".person").css({background-image: url('<?php echo get_stylesheet_directory_uri(); ?>/img/person.jpg')});

到

$(".person").css({"background-image"," url('<?php echo get_stylesheet_directory_uri(); ?>'/img/person.jpg")});

Answer 2

尝试以下语法

var imgUrl = '<?php echo get_stylesheet_directory_uri(); ?>/img/person.jpg';

$(".person").css("background-image","url("+ imgUrl +")");

jQuery不显示背景图像

2 个答案: