- 时间：2022-07-14 14:19 编辑： 来源： 阅读：
- 扫一扫，手机访问
摘要：javascript qq右下角滑出窗口 sheyMsg
(默认页面加载10秒后显示，显示30秒后自动隐藏，可自定义配置)
09-12-5： 修改图片文件，将几个背景放到一个图片文件里,并可切换两种样式风格 ，即qq的蓝色和红色
下载示例源码
[url=http://blog.csdn.net/sohighthesky/archive/2009/11/10/4795886.aspx]<dd>Author:<a href="http://hi.csdn.net/sohighthesky ">sohighthesky</a></dd>
<dd>Date:2009-11-10</dd>
<dd>style: <input type="radio" value="pink" name="style" id="pink" checked="checked" /><label for="pink">pink</label><input type="radio" value="blue" name="style" id="blue" /><label for="blue">blue</label></dd>
<dd>showDeplay:<input type="text" value="2" readonly="readonly"/></dd>
<dd>autoHide:<input type="text" id="txtAutoHide" value="30"/><input value="Set" type="button" id="btnSet"/><span id="info" style="color:#FF0000"></span></dd>
<dd><input type="button" id="btnControl" value="Show"/></dd>
</dl>
</div>
<!--sheyMsg start-->
<div class="msg pink" id="msgbox">
<div class="top">
<div class="title">CSDN News</div>
<span title="close" id="msgclose"></span>
</div>
<div class="center">
<h3>仿腾讯右下角消息提示</h3>
<p>showDalay:设置页面加载后显示时间延迟;<br />autoHide:显示后自动隐藏的时间，默认30秒，设置为0表示不自动隐藏;</p>
</div>
<div class="bottom"><a target="_blank" href="http://blog.csdn.net/sohighthesky/archive/2009/11/10/4795886.aspx">查看</a>
</div>
</div>
<!--sheyMsg end-->
</div>
</body>
<script type="text/javascript" src="sheyMsg.js"></script>
<script type="text/javascript">
var g=function(id){return document.getElementById(id)};
var msg=new sheyMsg("msgbox",{
showDelay:2,//
onHide:function(){
btn.value="Show";
},
onShow:function() {
btn.value="Hide";
}
});
g("pink").onclick=g("blue").onclick=function() {//switch style
g("msgbox").className="msg "+this.value;
}
var btn=g("btnControl");
btn.onclick=function() {//show or hide
if(this.value=="Show")
msg.show();
else
msg.hide();
}
g("btnSet").onclick=function() {//set autoHide
var v=g("txtAutoHide").value;
if(!isNaN(v)) {
msg.options.autoHide=v-0;
g("info").innerHTML="隐藏时间已设置,下一次show时生效";
setTimeout("g('info').innerHTML='';",3000);
}
}
g("msgclose").onclick=function() {//hide
msg.hide();
}
</script>
</html>
打包下载地址
sheyMsg 右下角滑出窗口效果代码[/url]
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码（独立后台）...
