Chrome一键“加入收藏”按钮实现代码(gears API)

在一些网站尤其是导航网站中上常常能够看到”加入收藏”、”设为首页”这样的链接,点击后就可以完成收藏本页以及更改首页操作,非常方便,也有助于提高网站的粘性。但由于各种浏览器的出现,要兼容所有浏览器越来越不容易了,目前网上翻出的代码还没见到有能够让Chrome“一键收藏”成功的。不过在前段时间开发拾贝电台应用(Chrome Webstore)的时候,发现通过调用gears API可以生成应用的桌面图标,像桌面软件的快捷方式一样方便使用,达到和加入收藏一样的效果。于是把兼容 IE6,IE7,FF 的”加入收藏”代码与之整合,实现兼容三大主流浏览器(IE、Firefox、Chrome)的“一键收藏”按钮。

实现代码:

<!– 加入收藏代码 Start –>
function AddFavorite(sURL, sTitle) {

    try { //IE
window.external.addFavorite(sURL, sTitle);
} catch (e) {
try { //Firefox
window.sidebar.addPanel(sTitle, sURL, “”);
} catch (e) {
try{//Chrome无法自动收藏,用创建快应用程序的捷方式来替代。
createShortcut();
} catch(e){
alert(“您的浏览器不支持自动加入收藏,请使用浏览器菜单手动设置.”);
}

    }
}

}
<!– 加入收藏代码 End –>

<!– 创建图标代码 Start –>
function createShortcut() {
var desktop = google.gears.factory.create(“beta.desktop”);
var description = “将网络电台放到桌面,方便日后访问该应用,享尽听广播乐趣!.”;
var name = “Online Radio”;

var icons = {
“16x16”: “images/icon16.png”,
“32x32”: “images/icon32.png”,
“48x48”: “images/icon48.png”,
“128x128”: “images/icon128.png”
};

desktop.createShortcut(name, // 应用名称,貌似不支持中文
“hello_world_shortcuts.html”, // url需考虑跨域问题
icons, // icons (至少一个尺寸)
description); // 应用描述 (可选)
}
<!– 创建图标代码 End –>
//买一送一,较为友好(在Chrome下同样有提示)的“设为首页”代码.

<!– 设为首页代码 Start –>
function setHomepage(pageURL) {
if (document.all) {
document.body.style.behavior=’url(#default#homepage)’;
document.body.setHomePage(pageURL);
}
else {
try { //IE
netscape.security.PrivilegeManager.enablePrivilege(“UniversalXPConnect”);
} catch (e) {
try{ //Firefox
var prefs = Components.classes['@mozilla.org/preferences-service;1’].getService(Components. interfaces.nsIPrefBranch);
prefs.setCharPref(‘browser.startup.homepage’,pageURL);
} catch(e) {
alert( “您的浏览器不支持该操作,请使用浏览器菜单手动设置.” );
}
}
}
}
<!– 设为首页代码 End –>

下面是调用方法:

<a title=”http://Radio.SBboy.com/“ href=”#” onclick=”javascript:setHomepage(this.title);return false;”>设为主页</a>
<a title=”http://Radio.SBboy.com/“ href=”#” onclick=”javascript:AddFavorite(this.title, document.title);return false;”>一键收藏</a>

使用情况:

目前测试的有Chrome 11、Firefox4、IE8 结果如下:

IE

Firefox

Chrome

设为首页

正常

提示手动

创建图标

加入收藏

正常

正常

提示手动



 

演示页面:

参看拾贝电台:http://radio.sbboy.com/

电台使用说明:http://sbboy.com/radiointro

也欢迎试用我的第一个Chrome应用:

——拾贝电台https://chrome.google.com/webstore/detail/bhcbhdhdggalgngebimnmphddjnjffdo.

分享到:

评论完整模式加载中...如果长时间无法加载,请针对 disq.us | disquscdn.com | disqus.com 启用代理