我正在寻找解决我已经有一段时间的问题的方法。基本上我有5个图像链接,如果我点击其中一个必须出现一个文本里面的div。如果我点击另一个链接,之前的div必须消失,并且必须出现相应的div。问题是我不能给当前选中的图像赋予样式。除此之外,我还有下面的5个其他链接,它们应该与上面的图像具有相同的链接,即使必须选择不同格式的链接。有谁能够帮助我?
发布于 2018-10-11 09:31:39
可以尝试嵌套div - 具有文本内容的div可以通过css隐藏。对于每个图像div,可以进行onclick,找到嵌套在图像div中的类/ id并切换类
$( "#click-me" ).click(function() {
$('#text').toggleClass( "hidden" );
});
.hidden {
visibility: hidden;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='click-me'>
<img src='https://i.stack.imgur.com/sM0BC.png'/>
<div id='text' class='hidden'>
Text
</div>
</div>
你可以在矩阵中做这样的事情。可以单击,将所有这些设置为隐藏,然后切换可见的唯一ID。
发布于 2018-10-11 10:57:58
像这样的东西
https://codepen.io/CthuKi/pen/YqZvRv
<div class="menu">
<a id="showall">All</a>
<a class="showSingle" target="1">Div 1</a>
<a class="showSingle" target="2">Div 2</a>
<a class="showSingle" target="3">Div 3</a>
<a class="showSingle" target="4">Div 4</a>
</div>
<section class="cnt">
<div id="div1" class="targetDiv">Content 1</div>
<div id="div2" class="targetDiv">Content 2</div>
<div id="div3" class="targetDiv">Content 3</div>
<div id="div4" class="targetDiv">Content 4</div>
</section>
https://stackoverflow.com/questions/-100002878
复制相似问题