只有画廊切换说明

Question

<div id="galleria">
    <img src="/img/pic1.jpg" data-title="title1" data-description="Et facilisis non. Sed, augue turpis eu, vel pellentesque aliquam, tristique ac, tincidunt placerat! Lundium, adipiscing et porttitor velit! Rhoncus adipiscing amet egestas, non dictumst.">
    <img src="/img/pic2.jpg" data-title="title2" data-description="Turpis enim elementum ac nisi magna tempor, aliquam, auctor tincidunt, scelerisque pellentesque parturient velit! Dolor et risus scelerisque vel augue nec, vel. Elementum in! Pid.">
</div>

我有这种类型的标记，图像有很长的描述，所以它们不需要一直显示，所以我想使用Galleria的默认galleria-info-link来切换描述，这样标题一直保持不变，用户可以切换描述。

尝试将功能更改为仅切换描述，但由于Galleria自动分配(display:block)给每个info-title和info-description，它不像预期的那样工作。

有办法吗?

Answer 1

在div id=galleria中试试这个:

<style>
.img_field span {
    display: none;
}
<div class='img_field'>
    <img .... />
    <span> Your description here </span>
</div>
<script>
    $('.img_field').mouseenter(function(){
        $(this).children('span').show();
    });
    $('.img_field').mouseleave(function(){
        $(this).children('span').hide();
    });
</script>