动态彩色飘带背景

相信大家都看到了站点背景后面的彩色飘带,动态效果真的很nice
本来这个主题的背景很单调,加入了这个js一下就...wonderful起来了呢(词穷ing)
其实这个js是从黑冰技术站扒下来的,这里搬运一下。

piao.js(点击下载)放到主题文件夹里面(不是网站根目录)

然后在主题文件的footer.php里,加入这么一句代码。

<script src="<?php $this->options->themeUrl('/piao.js'); ?>"></script>

代码只要加在<body>标签之内就好了,然后刷新网页。(◕ᴗ◕✿)

网站多分辨率预览

同样的,这也是在黑冰技术站上找的js,感觉自己除了搬代码就什么都不会了_(:з」∠)_

javascript:document.write('
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Responsive Design Testing</title>
<style>
body { margin: 20px; font-family: sans-serif; overflow-x: scroll; }
.wrapper { width: 6000px; }
.frame { float: left; }
h2 { margin: 0 0 5px 0; }
iframe { margin: 0 20px 20px 0; border: 1px solid #666; }
</style>
</head>
<body>
<div class="wrapper">
<div class="frame">
    <h2>240<span> x 320</span> <small>(mobile)</small></h2>
        <iframe src="' + window.location + '" sandbox="allow-same-origin allow-forms" seamless width="240" height="320"></iframe>
</div>
<div class="frame">
    <h2>320<span> x 480</span> <small>(mobile)</small></h2>
        <iframe src="' + window.location + '" sandbox="allow-same-origin allow-forms" seamless width="320" height="480"></iframe>
</div>
<div class="frame">
    <h2>480<span> x 640</span> <small>(small tablet)</small></h2>
        <iframe src="' + window.location + '" sandbox="allow-same-origin allow-forms" seamless width="480" height="640"></iframe>
</div>
<div class="frame">
    <h2>768<span> x 1024</span> <small>(tablet - portrait)</small></h2>
        <iframe src="' + window.location + '" sandbox="allow-same-origin allow-forms" seamless width="768" height="1024"></iframe>
</div>
<div class="frame">
    <h2>1024<span> x 768</span> <small>(tablet - landscape)</small></h2>
        <iframe src="' + window.location + '" sandbox="allow-same-origin allow-forms" seamless width="1024" height="768"></iframe>
</div>
<div class="frame">
    <h2>1200<span> x 800</span> <small>(desktop)</small></h2>
        <iframe src="' + window.location + '" sandbox="allow-same-origin allow-forms" seamless width="1200" height="800"></iframe>
</div>
</div>
</body>
</html>
')

对,就是这么长~❥(ゝω・✿ฺ)

首先将一个网页保存在书签里( ̄︶ ̄)↗

点击更多...(当然不同浏览器可能不一样)来修改书签的网址,将上面的代码粘贴进去。

然后进入一个网站,点击刚才保存的书签,最终效果如下图

当然还有更多的分辨率,可以往后拖动。

点击飘出文字、爱心

其实这个代码网上一搜就能找到,很普遍,自己整理了一下,直接扔到footer.php即可食用

<style>
@keyframes heartbeat {
    to {
        transform: scale(1.4);
    }
}
</style>
<script>
$("html,body").click(function(e) {
    var gcd = new Array("♥", "♥", "♥");//这里括号内的爱心可以改成文字,也可以往后增加多个文字,用","隔开
    var n = Math.floor(Math.random() * gcd.length);
    var $i = $("<b/>").text(gcd[n]);
    var x = e.pageX,
        y = e.pageY;
    $i.css({
        "z-index": 0,
        "top": y - 20,
        "left": x - 8,
        "position": "absolute",
        "color": "#FF706C",
        "animation": 'heartbeat .25s infinite .15s'
    });
    $("body").append($i);
    $i.animate({
        "opacity": 0
    }, 1500, function() {
        $i.remove()
    });
    e.stopPropagation()
});
</script>

一键填写个人信息

访问一个从没进过的博客,评论的时候,什么昵称、邮箱、网址都要自己重新填一遍,很烦,其实这个也能一个js书签搞定

javascript:void function(){var lauthor=["#author","input[name='comname']","#inpName","input[name='author']","#ds-dialog-name"],lmail=["#mail","#email","input[name='commail']","#inpEmail","input[name='email']","#ds-dialog-email"],lurl=["#url","input[name='comurl']","#inpHomePage","#ds-dialog-url","input[name='url']"];for(i=0;i<lauthor.length;i++){var author=document.querySelector(lauthor[i]);if(author!=null){author.value='名字在这里写';break}}for(j=0;j<lmail.length;j++){var mail=document.querySelector(lmail[j]);if(mail!=null){mail.value='邮箱在这里改';break}}for(k=0;k<lurl.length;k++){var url=document.querySelector(lurl[k]);if(url!=null){url.value='网址填在这里';break}}return!1}()

更改上面名字、邮箱、网址等信息,将其填入一个浏览器书签内(放在网址里),点击就可以一键填写评论信息。
(搬运自奕奕博客

可能以后见到一些有用的js还会在这里分享一下的,现在先不更了_(:з」∠)_