• 本站已对IE放弃治疗,请在Chrome、Firefox等现代浏览器浏览本站。记住我们的域名:wanysys.cc 加入本站QQ群,大家一起HIGH: QQ群
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏吧
  • 传送门:#

添加博客漂浮小人特效实用美化代码

前端 张昊翔 2年前 (2016-06-27) 714次浏览 2个评论 扫描二维码

漂浮小人

偶然之间在一个的博客上看到一个漂浮小人的JavaScript美化特效,感觉挺好看的,就拿过来用了,下面是添加代码的步骤,把这段代码添加到footer结束之前  

<!--.浮动小人-->    
<script type="text/javascript">
<?php if(is_home()) 
    echo 'var isindex=true;var title="";';
    else echo 'var isindex=false;var title="',  get_the_title(),'";'; ?>
<?php if((($display_name = wp_get_current_user()->display_name) != null)) 
    echo 'var visitor="',$display_name,'";'; 
    else if(isset($_COOKIE['comment_author_'.COOKIEHASH]))
         echo 'var visitor="',$_COOKIE['comment_author_'.COOKIEHASH],'";';
         else echo 'var visitor="游客";';echo "\n"; ?>
</script>
<script type="text/javascript" src="http://www.wanysys.cc/images/spig.<a href="http://www.wanysys.cc/tag/javascript" title="查看更多关于js的文章" target="_blank">js</a>"></script>
<style>
.spig {display:block;width:130px;height:170px;position:absolute;bottom: 300px;left:160px;z-index:9999;}
#message{color :#191919;border: 1px solid #c4c4c4;background:#ddd;-moz-border-radius:5px;
    -webkit-border-radius:5px;border-radius:5px;min-height:1em;padding:5px;top:-45px;position:absolute;
    text-align:center;width:auto !important;z-index:10000;-moz-box-shadow:0 0 15px #eeeeee;
    -webkit-box-shadow:0 0 15px #eeeeee;border-color:#eeeeee;box-shadow:0 0 15px #eeeeee;outline:none;}
.mumu{width:130px;height:170px;cursor: move;background:url(http://www.wanysys.cc/images/spig.png) no-repeat;}
</style>
<div id="spig" class="spig">
    <div id="message">加载中……</div>
    <div id="mumu" class="mumu"></div>
</div>
<!--.end浮动小人-->

JS文件下载地址:点击下载

图片下载地址:点击下载

图片2下载地址:点击下载

好了到这里就完成啦,快去看效果把!!!


素梅好翔博客 , 版权所有丨如未注明 , 均为原创 , 转载请注明出处:http://www.wanysys.cc/coding/front/597.html
喜欢 (1)
[18586878276]
分享 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(2)个小伙伴在吐槽
  1. 这代码贴的,都没格式。
    热腾网2016-06-30 21:36 回复 Windows 10 | Chrome 53.0.2774.3
    • 张昊翔
      已改,嘿嘿,谢谢提醒
      张昊翔2016-07-05 13:50 回复 Windows 10 | Firefox浏览器 45.0