Question

由于某种原因，这并不适合我。我有以下代码。

将鼠标悬停在db.regextest.aggregate([ { $match: { $expr: { $eq: [ { $toLower: "$first" }, { $let: { vars: { firstLen: { $strLenBytes: "$first" }, secondLen: { $strLenBytes: "$second" } }, in: { $toLower: { $substr: [ "$second", { $subtract: [ "$$secondLen", "$$firstLen" ] }, "$$firstLen" ] } } } } ] } } } ]) div上时，homeShowingWrapper div的背景应更改为homeHero div的data-featured-image属性的值。

这是我的HTML结构：

homeShowingWrapper

还有我的JQuery函数：

<div id="homeHero">
    <div class="homeShowingWrapper" data-featured-image="/uploads/Hover-Background.jpg">
        Content
    </div>
</div>

您知道为什么jQuery( document ).ready( function( $ ) { $("#homeHero").css("background-image" , "url(/uploads/Initial-Background.jpg);"); $(".homeShowingWrapper").mouseover(function() { // Background-image var background = $(this).attr('data-featured-image'); $("#homeHero").css("background-image" , "url(" + background + ");"); }); });行不应用背景图片吗？

Answer 1

正如Nawed Khan在评论中提到的那样，正确的数据属性读取方法是使用data()。

I set up a jsFiddle进行故障排除，发现不仅需要使用data('featured-image')，而且还需要省略jQuery .css()中的分号才能起作用。 / p>

在鼠标悬停时根据子div的属性设置父div的背景图像

1 个答案: