0

我如何在 HTML 实体和 #9660 之间切换；（向下的三角形）和＆#9664; （左指三角形）分别用于打开和关闭状态，显示在 h2 封闭内容旁边（在向右浮动的 span 元素内），使用 jQuery Collapse 脚本：https ://github.com/danielstocks/jQuery-Collapse ？

4

1 回答 1

1

您需要将 javascript 添加到可以为每个可折叠元素定义的打开/关闭函数中。我将下载文件中的以下演示修改为以下内容：

HTML（在带箭头的跨度中添加）：

<div class="col c2">
  <!-- BEGIN Custom open and close -->
  <h2>Custom show &amp; hide</h2>
  <div id="custom-show-hide-example">
    <h3><span>&#9660;</span>Hello</h3>
    <div>
      <p>Hello Sir.</p>
      <p>I'm sliding</p>
    </div>
    <h3><span>&#9660;</span>Anarachy in the UK</h3>
    <div>I like tea</div>
    <h3><span>&#9660;</span>Indeed</h3>
    <div>This is some information</div>
  </div>

Javascript（添加.html()了更改受影响跨度的html的功能）：

    new jQueryCollapse($("#custom-show-hide-example"), {
      open: function() {
        this.slideDown(150);
        $('#custom-show-hide-example h3 span').html('&#9664;'); /*my added line*/
      },
      close: function() {
        this.slideUp(150);
        $('#custom-show-hide-example h3 span').html('&#9660;'); /*my added line*/
      }
    });
于 2012-12-31T23:38:09.483 回答