javascript - 单击 slider 内的图像以显示文本

Question

关于 http://www.socialstudent.co.uk/stackoverflow/我正在尝试找到一种方法来制作它，因此当您在移动设备上点击图像时，它会在其下方显示文本和一个按钮。然后，如果您再次点击它，它就会消失。

我已经尝试了 JS 中的常用方法，但似乎都不起作用。任何关于如何实现这一点的想法都会很棒!

一个例子是这个 - http://jsfiddle.net/ZECTP/但在移动设备上点击图像。

JS 根据需要关闭 jsfiddle:

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

根据需要关闭 jsfiddle 的 HTML:

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

除了图像上的文本之外，它还需要出现，如下面的文本和一个按钮需要出现。

谢谢!

Answer 1

我检查了您提供的站点的源代码，您需要添加此代码才能获得预期的效果。我假设您想在每张图片上显示/隐藏文本。

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');
})