Question

我使用一段时间在网站上找到的一些jquery代码来切换内容。默认情况下，内容已关闭，当单击特殊链接时，内容将以平滑的幻灯片动画打开。到现在为止还挺好。问题是，默认情况下应隐藏的内容在页面加载之前是可见的，然后在加载jquery后立即关闭。我已将jquery放在页面的末尾，以减少网站内容的加载时间。我知道这种行为是很自然的但我已经看到了其他切换脚本之前，即使在jquery位加载之前，可以打开的内容也已关闭。问题是，互联网连接速度慢的人会看到隐藏的＆＃34;部分相当一段时间，直到页面加载完毕。然后该部分关闭，因为它应该默认关闭。

我已经尝试过css以便在加载jquery之前保持部件关闭但问题是我无法通过点击＆＃34显示更多＆＃34;链接，因为CSS仍然迫使它保持关闭.. 指压!!

继承我使用的代码：

<div class="morepara"> content that should be hidden by default can be opened by clicken on the image link below</div>

<p class="togglebutn">
<a>
<img src="/images/read-more.png" class="img-swap" aid="myImage"/>
</a>
</p>

<script type="text/javascript">
var $s = jQuery.noConflict();
$s('document').ready(function() {
    $s('.morepara div').hide();
    $s('.togglebutn a').click( function() {
        var parentpara = $s(this).parent().prev().children();
        parentpara.toggle('normal');
    });
});
$s(function() {
    $s(".img-swap").live('click', function() {
        if ($s(this).attr("class") == "img-swap") {
            this.src = this.src.replace("-more", "-less");
        } else {
            this.src = this.src.replace("-less", "-more");
        }
        $s(this).toggleClass("on");
    });
});
</script>

哦，图像交换脚本效果很好，没有任何问题：）

提前谢谢！：）

编辑：感谢所有快速答案..我现在使用 display：none; 选项，但我想知道这是否是seo的问题.. 经验告诉我谷歌确实计算默认隐藏的内容，但可以使用javascript显示.. 我不确定它是否会将内容编入索引，因为它现在将使用css隐藏有这方面的经验吗？

再次感谢！

Answer 1

通过向您的<div class="morepara"> display:none;提供CSS，div在打开网站时永远不会显示，即使是网络连接速度较慢的人也不会显示。

<div class="morepara" style="display:none;">

它实际上与：$s('.morepara').hide();相同只有在页面完全加载时才会执行。

Answer 2

你可以用CSS隐藏它：

.morepara {
    display:none;
}

...然后使用jQuery切换可见性

Answer 3

这是link。删除.children并将父项设置为none。

如何在打开/关闭切换jquery中设置默认值

3 个答案: