第一:抱歉我的英文不好!
有两个不同锚点的链接,例如:
<a href="www.test.ch?name=example#anchor1">
<a href="www.test.ch?name=example#anchor2">
当有人点击其中一个链接时,他会自动通过网站和位置,他应该是。好。
但在网站上有手风琴,文字没有显示。通过单击带有锚点2的链接,可以打开锚点2的位置。
这是jquery:
<script>
$().ready(function() {
$(".accordeon .ancor").click(function() {
var textContainer = $(this).parent().children(".text");
if (textContainer.is(":visible")) {
textContainer.slideUp();
$(this).attr("src", "images/accordon_open.jpg");
}
else {
textContainer.slideDown();
$(this).attr("src", "images/accordon_close.jpg");
}
});
$(".accordeon .text").hide();
});
</script>
链接内容的html:
<div class="accordeon">
<img class="ancor button" src="images/accordon_open.jpg">
<div class="title ancor">
Titel anchor 1
</div>
<div class="text">
<a name="anchor1"></a>
text anchor1 (should be not visible)
</div>
</div>
<div class="accordeon">
<img class="ancor button" src="images/accordon_open.jpg">
<div class="title ancor">
Titel anchor 2
</div>
<div class="text">
<a name="anchor2"></a>
text anchor2 (should be visible, because someone had click the link for it)
</div>
</div>
如何通过单击链接/锚点打开手风琴。谢谢你的帮助!
答案 0 :(得分:0)
你错过了你必须首先隐藏元素,所以他们不显示。您可以使用$("div.text").hide();
$().ready(function() {
$("div.text").hide();
$(".accordeon .ancor").click(function() {
var textContainer = $(this).parent().children(".text");
if (textContainer.is(":visible")) {
textContainer.slideUp();
$(this).attr("src", "images/accordon_open.jpg");
}
else {
textContainer.slideDown();
$(this).attr("src", "images/accordon_close.jpg");
}
});
$(".accordeon .text").hide();
});
这是fiddle
答案 1 :(得分:0)
添加JavaScript以检查URL中的锚点并打开手风琴:
if(window.location.hash){
$(window.location.hash + ".accordeon .text").show();
$(window.location.hash + ".accordeon img").attr("src","images/accordon_close.jpg");
}