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

标签 javascript jquery css

关于 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>

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

谢谢!

最佳答案

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

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

关于javascript - 单击 slider 内的图像以显示文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30377390/

相关文章:

javascript - 如何解决未捕获的语法错误: Unexpected Identifier while passing a string to javascript function using onclick inside PHP echo

javascript - 在 node js 服务器的终端中无法识别 nodemon 命令

javascript - DIV 分成两半并作为子项添加到循环中

javascript - Fancybox - 无法使用 jQuery 设置 CSS?

带边框的 CSS 问题

javascript - 如何区分 'real' 和 'virtual' onpopstate 事件

javascript - 如何检查 Chrome 扩展程序中是否启用了暗模式

javascript - Raphael 绘图和 Ajax 调用问题

javascript - 当存在重复值时,按值选择第一个选项

javascript - 仅在加载图像时才对图像应用阴影?