// 文章页添加展开收缩效果
function xcollapse($atts, $content = null){
	extract(shortcode_atts(array("title"=>""),$atts));
	return '
    <style>.xControl {
    font-size: 15px;
    font-weight: bold;
    padding: 5px 0;
    box-shadow:0 0 20px #d0d0d0;/* 阴影 */
    background-color: #FFFFFF;/* 背景颜色 */
    border-bottom: 2px solid #9c1111;/* 边 */
    transition: all 0.1s linear;
    text-align: center;
    border-radius: 0 0 5% 5%;
    border-radius:4px;
}
.xControl a{
	text-decoration: none;
    display: block;}
.xControl a:hover {
	text-decoration: none;
    display: block;
    color:red;
}
.xControl i{font-style:normal;}
</style>
<div style="margin: 0.5em 0;">
		    <div class="xControl">
			    <a href="javascript:void(0)" class="collapseButton xButton"> <i class="fa fa-toggle-on" aria-hidden="true">&nbsp;</i><span class="xTitle">'.$title.'</span></a>
			    <div style="clear: both;"></div>
		    </div>
		<div class="xContent" style="display: none;">'.$content.'</div>
	</div>';
}
add_shortcode('collapse', 'xcollapse');



//添加展开/收缩快捷标签按钮
function appthemes_add_collapse() {
?>
    <script type="text/javascript">
      if ( typeof QTags != 'undefined' ) {
            QTags.addButton( 'collapse', '展开收缩按钮', '
    
' );
        } 
    </script>
<?php 
}

heard.php中添加

<script type= "text/javascript" >
     jQuery(document).ready( function (jQuery) {
         jQuery( '.collapseButton' ).click( function () {
             jQuery(this).parent().parent().find( '.xContent' ).slideToggle( 'slow' );
         });
     });
</script>

 

使用方法

Leave a Reply

Your email address will not be published.

请下载到本地观看!因为pdf是用的阿里云盘预览,可能部分字体加载不了。

请安装油猴脚本,并下载月离的万事屋脚本

请在右上角三个点 - 下载管理 - 找到刚才的文件,选择允许下载。 或者换个浏览器
echo