Saber 酱的抱枕

Fly me to the moon

12/29
2015
学习

saber酱の音乐播放器

这个html5音乐播放器是我花了一天时间琢磨出来的,因为好歹做了个像样的界面,所以版本姑且就叫1.0了。

使用了cookie来记住播放的音乐、音量和循环模式。没有做后台功能,例如评分、喜欢等。

使用网易云音乐的歌单做歌曲列表。

另外,音乐的缓冲进度条可能加载到中途就停止了,这个浏览器的行为,和本播放器无关。chrome经常会这样,火狐则是一口气加载完。如果有需要的话,浏览器会继续加载。
Read More →

saber酱の音乐播放器

12/26
2015
学习

在网页中播放背景音乐的简单示例

这是昨天圣诞的时候,本站播放背景音乐《ホーリーナイト》的代码:

<div id="MerryChristmasMusicCtrl" date-playCtrl="pause"></div>
<style>
	 #MerryChristmasMusicCtrl{width:25px;height:118px;text-align:center;font-size:14px;font-family:微软雅黑;position: fixed;z-index: 9999;background:#444;color:#fff;cursor: pointer;right:0;top:30%;border-radius: 4px;border:1px solid #000; display: none;}
</style>
<script>
	var MerryChristmasMusic=document.createElement("audio");
	MerryChristmasMusic.src="http://m2.music.126.net/RLgypZOeXF0W2HEUIA0Wpg==/5959353022986536.mp3";
	MerryChristmasMusic.loop="loop";
	MerryChristmasMusic.play();
	$("#MerryChristmasMusicCtrl").show();
	$("#MerryChristmasMusicCtrl").html("暂停播放音乐");
	$("#MerryChristmasMusicCtrl").click(function  () {
		if ($("#MerryChristmasMusicCtrl").attr("date-playCtrl")=="pause") {
			MerryChristmasMusic.pause();
			$("#MerryChristmasMusicCtrl").html("继续播放音乐");
			$("#MerryChristmasMusicCtrl").attr("date-playCtrl","play");
		}else{
			MerryChristmasMusic.play();
			$("#MerryChristmasMusicCtrl").html("暂停播放音乐");
			$("#MerryChristmasMusicCtrl").attr("date-playCtrl","pause");
		};
	});
</script>

请无视蛋疼的超长变量名……

这两天打算写个音乐播放器出来,看能不能完成吧。

在网页中播放背景音乐的简单示例

12/26
2015
学习

筛选pixiv搜索页面中的作品

p站会员过期了,无法直接按收藏数搜索了。普通用户看到的作品貌似是按时间排序的,这里面质量参差不齐,为了快速筛选高素质的作品,搞了下面这个小玩意,可以把收藏数低于指定标准的作品从页面中删除:

var wantNum=100;
var allPicArea=$(".autopagerize_page_element .image-item");
for (var i = 0; i <allPicArea.length; i++) {
	if (allPicArea.eq(i).find("._ui-tooltip").length==0||allPicArea.eq(i).find("._ui-tooltip").eq(0).text()<wantNum) {
		allPicArea.eq(i).remove();
	};
};

直接在控制台执行就可以,这个100用的时候自己改吧。

虽然使用了jQuery,但p站页面引用的有,我们不用自己再引用了。

ps:写的时候犯了低级错误,应该用find()的,用成了children(),还是用的太少了。

筛选pixiv搜索页面中的作品

12/24
2015
学习

去掉document.referrer的两种方法

JavaScript中的document.referrer属性保存了来源网页,也就是当前页面是从哪个网址跳转或打开的。如果想要去除document.referrer信息,有两种办法:

1.对于支持html5特性的浏览器,直接在超链接上加上的属性:

<a href="index.php" rel=noreferrer>测试</a>

这样,在跳转后的页面中查看属性,值为空。

2.对于不支持html5的浏览器,例如IE8,也先加上rel=noreferrer属性,然后使用JavaScript代码来去除:

<a href="index.php" rel=noreferrer>测试</a>
<script src="https://code.jquery.com/jquery-1.8.0.min.js"></script>
<script>
	 $.browser.webkit || $.event.add(window, "load", function () { //webkit系列浏览器啥也不做
	     //把所有带有rel=noreferrer的链接找出来变量处理
	     $("a[href][rel~=noreferrer], area[href][rel~=noreferrer]").each(function () {
	         var b, e, c, g, d, f, h;
	         b = this;    //b表示当前链接dom对象
	         c = b.href;  //保存原始链接
	         $.browser.opera ? (b.href = "http://www.google.com/url?q=" + encodeURIComponent(c), b.title || (b.title = "Go to "     + c)) : (d = !1, g = function () { //Opera做了些啥暂不管
	             b.href = "javascript:void(0)"
	        }, f = function () {
	            b.href = c
	        }, $(b).bind("mouseout mouseover focus blur", f).mousedown(function (a) { //鼠标out over focus blue都把链接还原
	            a.which === 2 && (d = !0) //鼠标down时,且鼠标中间按下时,把标志d设成true
	        }).blur(function () { //blur把标志d设成false
	            d = !1
	        }).mouseup(function (a) {
	            if (!(a.which === 2 && d)) return !0;
	            g();
	            d = !1;
	            setTimeout(function () {
	                alert("Middle clicking on this link is disabled to keep the browser from sending a referrer.");
	                f()
	            }, 500);
	            return !1
	        }), e = "<html><head><meta http-equiv='Refresh' content='0; URL=" + $("<p/>").text(c).html() + "' /></head><body><    /body></html>", $.browser.msie ? $(b).click(function () { //e是一个0秒自动刷新的页面,指向原始链接,但是没搞懂为什么搞个p标签在这里??
	            var a;                             //如果是IE的话
	            switch (a = this.target || "_self") {
	            case "_self": 
	            case window.name:
	                a = window;
	                break;
	            default:                           //如果原始链接的目标是本窗口,则在本窗口操作        
	                a = window.open(null, a)       //如果原始链接的目标不是本窗口,则用js open一个空窗口
	            }
	            a = a.document;
	            a.clear();                         //清除窗口的document
	            a.write(e);                        //写入上面构造的0秒自动刷新的页面
	            a.close();                         //关闭文档使其展示出来
	            return !1                          //如果非IE(firefox), 是用的'Data URI scheme'承载0秒自动刷新的页面
	        }) : (h = "data:text/html;charset=utf-8," + encodeURIComponent(e), $(b).click(function () { //最后js触发点击
	            this.href = h; 
	            return !0
	        })))
	    })
	})
</script>

这样,跳转后的网页查看rel=noreferrer属性也是空的。

需要注意的是,由于使用了$.browser,所以jQuery版本不能高于1.9。

去掉document.referrer的两种方法

12/23
2015
软件

看到一些人对Bandizip的评论,我啼笑皆非

刚才要在服务器上装Bandizip,于是去百度,顺手点开了异次元软件对Bandizip的介绍。看完了评论,我大概就是这个表情:

个个都是大神:

没有压缩和解压速度的测评不能打动我:)
这玩意有没有说明压缩比,并与7z,zip,rar比较?
右键属性没有压缩率,就又卸载了

压缩率是你们爹?你们是每天都要压缩几百G的数据,还是说用的是256G硬盘?

是人性化重要还是压缩率重要,整天就知道吹逼。压缩率高的话通常会更费时间、更耗CPU,这些怎么不见有人说了。

顺便再推一下我心爱的Bandizip

看到一些人对Bandizip的评论,我啼笑皆非

12/22
2015
学习

解决商务通无轨迹问题

商务通的无轨迹通常是由于用了“仅超链接”点击进来的;把商务通超链接做成中间页跳转也会发生同样的问题。因此我们尽量把商务通链接都用商务通自带的函数打开咨询窗口:

<a href="#" onclick="LR_HideInvite();openZoosUrl();return false;" target="_blank"></a>

也可以写成函数方便调用:

function swtClick()
{
LR_HideInvite();
openZoosUrl();
return false;
}

但第三方网站上不能这么做,目前只能在链接后面加上对话入口说明和入口网址了。

解决商务通无轨迹问题