单击滑动条内的图像以显示文字

对我有用[0]丢个板砖[0]引用当我在手机上点击一个图像时，它会让文本出现在它的下面和一个按钮。然后，如果再次点击它会消失。单击滑动条内的图像以显示文字

我已经尝试了JS中的常用方式，但似乎没有工作。关于如何让这种事情发生的任何想法都会很棒！

一个例子是这个 - http://jsfiddle.net/ZECTP/但随着移动的图像被挖掘。

JS关闭的jsfiddle作为被要求：作为被要求

$(function() { 
     var div = $('#showOrHideDiv'); 
     $('#action').click(function() { 
      div.fadeToggle(1000); 
     }); 
    });

HTML关闭的jsfiddle：

<a id="action" href="#">hide/show text</a> 
<div id="showOrHideDiv" style="display: none;">hidden text</div>

它需要除了其是在图像上的文本，如下文本并且需要出现一个按钮。

谢谢！

来源

2015-05-21 Max

你的代码出了什么问题小提琴似乎在工作？ – brso05

这只是我想要做的一个例子，但它不适用于当前的设置。 – Max

如果我们不知道当前设置，我们将如何帮助您？ – brso05

入住这udpated fiddle

我认为这是你在找什么。

HTML

<figure class = "figure"> 
    <img src = "http://icons.iconarchive.com/icons/dapino/summer-holiday/96/photo-icon.png" /> 
    <figcaption class = "figcaption"> 
     SOME TEXT HERE  
    </figcaption> 
</figure>

CSS

figure { 
    font-size: 100%; 
} 

figcaption { 
    display: none; 
}

jQuery的

$(document).ready(function(){ 
$(".figure").click(function(){ 
    $(".figcaption").toggle(); 
}); 
});

来源

2015-05-21 15:13:33

这是移动文本，我需要的是新鲜的文本出现在图像上点击！ – Max

如果你想要这样的东西，然后检查我的编辑:)检查小提琴，它的编辑 –

嘿，男人，试过这个，但给我的图像我在边界上使用它，并没有发生onclick。也许与我使用的滑块有关？我也移动了滑块DIV之外的东西，但打破了滑动条，但工作原理如下文所示。 – Max

我检查你提供图片的网站的源代码ided，您需要添加此代码才能获得所需的效果。我假设你想在每张图片上显示/隐藏文字。

var elems = $('#my_horizontal_main_stage li'); 
elems.find('div').hide(); // text hidden by default, or you can use css 
elems.on('click', function(e){ 
    el = $(this); 
    el.find('div').fadeToggle('fast'); 
})

来源

2015-05-21 15:20:34 victmo

嗨！感谢这一点，但我需要的是出现在下面的新文本，已更新我的原始帖子，以显示此。 – Max

单击滑动条内的图像以显示文字

回答

相关问题