问题描述:

I have a div class "asset-container" with a data-id attribute.

I also have a div class "popover-content" with an associated data-id.

When I hover over "asset-container", I want the "popover-content" show.

There are a lot of these, which is why I have data-id attached to each of the two divs so I can call the associated div to show.

I have tried several iterations of script and am not getting anywhere

js:

$(document).ready(function() {

custom_popover();

});

function custom_popover() {

$(".asset-container").mouseover(function() {

$('.popover-content [data-id=' + this.value + ']').show();

});

}

html:

<ul class="col-xs-4">

<li class="thumnail-video">

<div class="popover-content" data-id="71"></div>

<div class="asset-container">

<video class="img-responsive portrait" type="video/mp4" src="https://ternpro-development.s3.amazonaws.com/media/films/71/mobile/3.mp4" data-id="71"> </video>

</div>

</li>

</ul>

<ul class="col-xs-4">

<li class="thumnail-video">

<div class="popover-content" data-id="69"></div>

<div class="asset-container">

<video class="img-responsive landscape" type="video/mp4" src="https://ternpro-development.s3.amazonaws.com/media/films/69/mobile/2.mp4" data-id="69"></video>

</div>

</li>

</ul>

</div>

网友答案:

Change your code to:

$(".asset-container").mouseover(function() {
   var id = $(this).children("video").data("id");
   $(this).parent().children('.popover-content[data-id=' + id + ']').show();
});
相关阅读:
Top