php弹出公告,wordpress主题右下角jquery弹出公告

在HotStyle主题在集成了右下角弹出最新公告的功能，此功能可以通过后台主题选项轻松开启关闭，现在就其实现方法做以下描述。

这一功能的实现非常简单，其利用jquery的fadeTo或者Hide的功能。

1，加载jquery.js.

script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"/script

2，加载以下js代码：

script type="text/javascript"

$(document).ready(function() {

//$('#sitefocus').hide(0, 0);

//$('#sitefocus').fadeIn(1800, 0);

$('.bm_h a').click(function() {

//$('#sitefocus').hide();

//$('#sitefocus').fadeTo(500, 0);

$('#sitefocus').hide(600, 0);

return false;

});

});

/script

3，css格式。

style type="text/css"

.focus {

position:fixed;

rightright:5px;

bottombottom:5px;

z-index:300;

overflow:hidden;

width:250px;

border:1px solid #AAA;

padding:0 10px;

background:white;

}

.bm,.bn {

margin-bottom:10px;

}

.bm_h {

padding:0 10px;

height:40px;

border-bottom:4px solid #009AD9;

line-height:40px;

whitewhite-space:nowrap;

overflow:hidden;

}

.cl {

zoom:1;

}

.y {

float:rightright;

}

a {

color:#333;

text-decoration:none;

}

h1,h2,h3,h4,h5,h6 {

font-size:1em;

}

body,ul,ol,li,dl,dd,p,h1,h2,h3,h4,h5,h6,form,fieldset,.pr,.pc {

margin:0;

padding:0;

}

.bm_c {

background:white;

}

.bbda {

border-bottom:1px dashed #CDCDCD;

}

.cl {

zoom:1;

}

.xld dt {

padding:8px 0 5px;

font-weight:700;

}

.bm_c h2 a,.bm_c dt a {

padding-right:10px;

color:#4A4E52;

}

.focus dt a {

color:#0060A6;

font-size:12px;

}

.xi2,.xi2 a,.xi3 a {

color:#266CB5;

}

.xld dd {

margin-bottom:8px;

}

.hm {

text-align:center;

}

.ptn {

padding-top:5px!important;

}

a:hover,* a:hover {

color:#F60 !important;

}

/style

4，php和html代码调用最新公告。

?php

$loop = new WP_Query( array( 'post_type' = 'bulletin', 'posts_per_page' = 1 ) );while ( $loop-have_posts() ) : $loop-the_post();

?

div class="focus" id="sitefocus"

div class="bm"

div class="bm_h cl"

a href="#" class="y" title="关闭"关闭/a

h2临时公告/h2

/div

div class="bm_c"

dl class="xld cl bbda"

dt

a href="?php the_permalink(); ?" class="xi2" target="_blank"

?php the_title(); ?

/a

/dt

dd

?php echo mb_strimwidth(strip_tags(apply_filters( 'the_content', $post-

post_content)), 0, 68,"..."); ?

/dd

/dl

p class="ptn hm"

a href="?php the_permalink(); ?" class="xi2" target="_blank"查看 »/a

/p

/div

/div

/div

?php endwhile; ?

这里循环调用最新公告，由于此公告由主题集成，所以不具有统一性，请根据个人实际需要做修改。