如何在自己的xiuno网站上实现鼠标点击特效效果出现民主富强爱国平等自由等效果?

程序猿 2018-5-30 2108

实现这样的效果并不难,加入一小段JS代码即可:

<script>
(function() {
    var coreSocialistValues = ["富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业", "诚信", "友善"],
    index = Math.floor(Math.random() * coreSocialistValues.length);
    document.body.addEventListener('click',
    function(e) {
        if (e.target.tagName == 'A') {
            return;
        }
        var x = e.pageX,
        y = e.pageY,
        span = document.createElement('span');
        span.textContent = coreSocialistValues[index];
        index = (index + 1) % coreSocialistValues.length;
        span.style.cssText = ['z-index: 9999999; position: absolute; font-weight: bold; color: #ff6651; top: ', y - 20, 'px; left: ', x, 'px;'].join('');
        document.body.appendChild(span);
        animate(span);
    });
    function animate(el) {
        var i = 0,
        top = parseInt(el.style.top),
        id = setInterval(frame, 16.7);
        function frame() {
            if (i > 180) {
                clearInterval(id);
                el.parentNode.removeChild(el);
            } else {
                i += 2;
                el.style.top = top - i + 'px';
                el.style.opacity = (180 - i) / 180;
            }
        }
    }
} ());
</script>

把这段代码放入网页的末尾处。

或者直接下载下面的插件放到 plugin/ 目录下,去后台开启插件。


上传的附件:
上一篇:没了下一篇:虚拟数据库地址ComsenzEXP使用方法
  下载问题反馈贴 2018-05-16
火焰驹秦腔网申明 1、本网站名称:火焰驹秦腔网  网址:huoyanju.cn
2、本网站的资源主要来源于网络,如有侵权,请联系客服QQ/微信/邮箱:312215120进行删除处理。
3、会员发帖仅代表会员个人观点,并不代表本站赞同其观点和对其真实性负责。
4、不得发布和链接任何有关政治, 色情, 宗教, 迷信.低俗、变态、血腥、暴力以及危害国家安全.诋毁政府形象等违法言论和信息的帖子.
5、本站资源大多为百度网盘,如发现链接失效,可以点: 这里进行反馈,我们会第一时间更新。
最新回复 (3)
  • 程序猿 2018-5-30
    0 2
    "富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业", "诚信", "友善"   这些内容可以自己修改!
  • 兜兜 2018-6-22
    0 3
    6666
  • wzayz 2018-7-24
    0 4
    好啊
    • 火焰驹秦腔网-陕西秦腔汇-huoyanju.cn
      5
         登录 注册 QQ登录 微博登录
返回