iT邦幫忙

DAY 17
0

jQuery 套件開發之我可不可以跳著說系列 第 13

jQuery套件開發之(十六),寫套件常用的兩個function

  • 分享至 

  • xImage
  •  

jQuery套件開發之(十六),寫套件我常用的小function

有兩個

其中一個是給兩個元素

然後會把第一個參數的元素,放到第二個參數的元素的中間。

這裡的中間是指位置座標。

function putCenter(eleIn$, eleOut$)
{
    var positionOut = eleOut$.position() ;

    var centerOut = 
    {
          x: ( positionOut.left + (eleOut$.outerWidth() / 2) ) >> 0
        , y: ( positionOut.top + (eleOut$.outerHeight() / 2) ) >> 0
    } ;
    var offsetIn = eleIn$.offset() ;

    eleIn$
        .css(
        {
              left: ( centerOut.x - (eleIn$.outerWidth() / 2) ) >> 0
            //, top: ( centerOut.y - (eleIn$.outerHeight() / 2) ) >> 0
        })
        .fadeIn() ;
}

附帶一提, >> 純粹只是懶惰的取整數的方式,其實這不太好。

另外一個function類似PHP sprintf

因為常常我已經寫好套件的版了。

只是要針對class、id 反正就去塞一些設定值。

String.prototype.format = function()
{
    var args = arguments ;

    return this.replace(/{(\d+)}/g, function(match, number)
    {
        return typeof (args[number] != 'undefined') ? args[number] : match ;
    }) ;
};

//實際的用法
var Dlogtpl = '<div class="{0}">'+
                    '<div class="{1}">'+
                        '<div class="{2}">'+
                            '<div class="{3}"></div>'+
                            '<div class="{4}"></div>'+
                        '</div>'+
                        '<div class="{5}"></div>'+
                        '<div class="{6}"></div>'+
                    '</div>'+
                '</div>' ;                            

//第二個例子
'<a href={0}>{1}</a>'.format(url, text)

今天就這樣吧

^__^


上一篇
jQuery套件開發之(十一),先處理widget的外觀。
下一篇
jQuery套件開發之(十七),實作drag的的部分
系列文
jQuery 套件開發之我可不可以跳著說26
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言