您的位置:首页 > 产品设计 > UI/UE

EZo UIBuilder中嵌入微博分享按钮【实例】

2012-08-29 00:00 218 查看
EZo UIBuilder中除了可以通过GUL 标签快速画出gxt 效果的画面外,还可以轻松嵌入html标签及javascript,实现web端的任意扩展性。通过SN分享相关文章已成为网站不可缺少的一部分。以下为在GUL中嵌入sina 微博分享按钮的实例代码:

<page>
<hp>
<div id="sinaweibo">
</div>
</hp>
<js init='js:this'>
<![CDATA[
var _w = 72 , _h = 16;
var param = {
url:location.href,
type:'3',
count:'1', /**是否显示分享数,1显示(可选)*/
appkey:'', /**您申请的应用appkey,显示分享来源(可选)*/
title:'', /**分享的文字内容(可选,默认为所在页面的title)*/
pic:'', /**分享图片的路径(可选)*/
ralateUid:'', /**关联用户的UID,分享微博会@该用户(可选)*/
language:'zh_cn', /**设置语言,zh_cn|zh_tw(可选)*/
rnd:new Date().valueOf()
}
var temp = [];
for( var p in param ){
temp.push(p + '=' + encodeURIComponent( param[p] || '' ) )
}
var sinaweiboDiv = document.getElementById("sinaweibo");
//sinaweiboDiv.setAttribute("height",_h);
//console.log(sinaweibo);
sinaweibo.innerHTML = '<iframe allowTransparency="true" frameborder="0" scrolling="no" src="http://hits.sinajs.cn/A1/weiboshare.html?' + temp.join('&') + '" width="'+ _w+'" height="'+_h+'"></iframe>';
]]>
</js>
</page>


1、<hp></hp>中可以嵌入html标签

2、<js></js>标签内写javascript代码

3、 <div id="sinaweibo"> </div> 图片定位位置

4、通过sina微博开放平台取得所需的分享按钮JS代码http://open.weibo.com/sharebutton

分享按钮应用在EZo UIBuilder 快速打造沪深股市实时行情的demo地址:http://www.ezoui.com/tryit/User/feizhang/sinastock.gul

ps:GUL标签含义请查阅官网http://www.ezoui.com.cn
关键点用sinaweibo.innerHTML代码替代微博平台生成的document.write进行代码定位
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息