Question

我正在使用博客来组织我的想法。我在一个页面中安排原始的想法，在相关标题下放置了许多想法。随着思想清单的增加，我无法对我正在进行的探索或决定进行概述。

我在这里搜索了所有内容，并尝试包含某些代码，但未能得到结果。由于我对网页设计语言一无所知，因此很难获得这种灵活性。我现在应该怎么做博客？我应该放置哪些代码来获得隐藏/显示功能？

Answer 1

首先，将此代码（它已经包含在<script>标签中）添加到您的网站。

<script type="text/javascript" language="JavaScript">
    function HideContent(d) {
        document.getElementById(d).style.display = "none";
    }
    function ShowContent(d) {
        document.getElementById(d).style.display = "block";
    }
    function ReverseDisplay(d) {
        if(document.getElementById(d).style.display == "none") { document.getElementById(d).style.display = "block"; }
        else { document.getElementById(d).style.display = "none"; }
    }
</script>

接下来，添加一个具有唯一ID的<div>（您选择的是由您决定的，只需在整个代码中保持ID相同）。像这样：

<div id="uniquename" style="display:none;">
    <p>Content goes here.</p>
</div>

最后，添加一个<a>元素（属性的缩写，基本上是指可点击的文本）。这将创建（默认为蓝色）文本，说明＆＃34;阅读更多＆＃34;。单击时，会展开div。

<a href="javascript:ShowContent('uniquename')">Read more</a>

隐藏div的文字：

<a href="javascript:HideContent('uniquename')">Show less</a>

对于切换div的代码：

<a href="javascript:ReverseDisplay('uniquename')">Read more/less</a>

要更改链接的颜色（即使这不是最佳方式），请执行以下操作：

<a href="javascript:ReverseDisplay('uniquename')" style="color:green;">Read more/less</a>

您可以替换＆＃34;绿色＆＃34;使用大多数颜色或十六进制代码。

如何在单击Blogger界面中的文本时展开内容？

1 个答案: