这只是一个例子： -

Question

如何创建一个功能，例如单击左侧的标题，将自动在右侧显示详细信息。它使用Wordpress中的插件或短代码？请提出建议，谢谢。

Answer 1

希望这会对你有所帮助：

这只是一个例子： -

        <!DOCTYPE html>
        <html>
        <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <style>
        .details {display : none;width:50%;float:left;}
        .title{
        float: left;
        width:50%
         }
         .extra{width:100%;float:left;}
        </style>
        <script>
        $(document).ready(function(){
        $(".title").click(function(){
         $('.details').hide();
          $(this).next().toggle();

        });
        });
        </script>
        </head>
        <body>
        <div class="extra">
        <div class="title">Title1</div>
        <div class="details">
        <p>This is a paragraph with little content.</p>
        <p>This is another small paragraph.</p>
        </div>
        </div>
        <div class="extra">
        <div class="title">Title2</div>
        <div class="details">
        <p>This is a paragraph with little content.</p>
        <p>This is another small paragraph.</p>
        </div>
        </div>
        <div class="extra">
        <div class="title">Title3</div>
        <div class="details">
        <p>This is a paragraph with little content.</p>
        <p>This is another small paragraph.</p>
        </div>
        </div>

        </body>

如何单击左侧的标题，并在Wordpresss的右侧显示详细信息

1 个答案:

这只是一个例子： -