用Windows Live Writer 2009 发布测试的

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Untitled Document</title>
        <style type="text/css">
            #ifrContent {
                width: 100%;
                height: 100%;
                display: block;
                clear: both;
                margin: 0;
                margin-top: 0px;
                background: #e8e8e8;
                border: 1px solid #888888;
            } .box {
                /*
                 position:absolute;
                 zoom:1;
                 */
                display:none;
            } .box-tl {
                background: url(images/QQ2008/1_1.gif) no-repeat 0 0;
                padding-left: 6px;
                zoom: 1;
            } .box-tc {
                height: 28px;
                background: url(images/QQ2008/1_2.gif) repeat-x 0 0;
                overflow: auto;
                color: #000;
                font-size: 12px;
                font-weight: bold;
                line-height: 28px;
                cursor: move;
            } .box-tr {
                background: url(images/QQ2008/1_3.gif) no-repeat right 0;
                padding-right: 4px;
            } .box-ml {
                background: url(images/QQ2008/2_1.gif) repeat-y left;
                padding-left: 6px;
            } .box-mc {
                /*padding:4px 10px;*/
            } .box-mr {
                background: url(images/QQ2008/2_3.gif) repeat-y right;
                padding-right: 6px;
            } .box-bl {
                background: url(images/QQ2008/3_1.gif) no-repeat left;
                padding-left: 6px;
            } .box-bc {
                height: 28px;
                background: url(images/QQ2008/3_2.gif) repeat-x;
            } .box-br {
                background: url(images/QQ2008/3_3.gif) no-repeat right;
                padding-right: 6px;
                cursor: se-resize;
            } .box-tool {
                position: absolute;
                top: 1px;
                right: 6px;
            } .box-tool a {
                display: block;
                height: 19px;
                width: 31px;
                background: url(images/QQ2008/close.gif);
            } .box-tool a:hover {
                background-position: left -19px;
            } .overlayClass {
                background: url(images/back15_043.gif) #fff;
            }
        </style>
        <script type="text/javascript" src="JS/jquery.js">
        </script>
        <script type="text/javascript" src="js/jqModal.js">
        </script>
        <script type="text/javascript" src="JS/jqDnR.js">
        </script>
        
        <script type="text/javascript">
            //definde my selector for jQuery
            $.extend($.expr[':'],{
                over100pixels : function(a){
                    return $(a).height() > 100;
                }
            });
            function testOver100pixels(){
                var $divs = $("div:over100pixels");
                alert($divs[0].innerHTML)
            }
            
            function navigateUrl(obj){
                var iframe = document.getElementById("ifrContent");
                iframe.src = obj.href;
                return false;
            }

            String.prototype.getQuery = function(name){
                var reg = new RegExp("(^|&)"+ name+"=([^&]*)(&|$)");
                var r = this.substr(this.indexOf("\?")+1).match(reg);
                if(r != null)return unescape(r[2]);
                return null;
            };
            String.prototype.trimEnd = function(str){
                var reg = new RegExp("(.*)" + str + "$");
                var r = this.match(reg);
                if(r != null)return r[1];
                return this;
            };
            
            $().ready(function(){
                var OpenInFrame = function(hash){
                    var $modal = $(hash.w);
                    var $trigger = $(hash.t);
                    var $frame =$('iframe',$modal);
                    var url = $trigger.attr("href");
                    url = (url.lastIndexOf("#") > -1) ? url.slice(0, url.lastIndexOf("#")) : url;
                    
                    var title = $trigger.attr("title");
                    if(!title || title == "")
                        title = "系;
                    
                    //set the title
                    $('.box-tc',$modal).text(title);
                    //load the page in the iframe from the href    
                    $frame.attr("src",url);
                    
                    var nTop = 0;
                    var nLeft = 0;
                    var nWidth = url.getQuery("width") || url.getQuery("w") || $modal.css("width");
                    var nHeight = url.getQuery("height") || url.getQuery("h") || $modal.css("height");
                    var bRefresh = url.getQuery("jqmRefresh") || url.getQuery("r");
                    nWidth = nWidth.trimEnd("px");
                    nHeight = nHeight.trimEnd("px");
                    //figure the percentage
                    if(nWidth > 0 ){
                        if (nWidth.indexOf("%") > -1) {
                            nWidth = nWidth.trimEnd("%");
                            nWidth = Math.floor(parseInt($(window).width()) * (parseInt(nWidth) / 100));
                        }
                        nLeft =Math.floor((parseInt($(window).width()) - parseInt(nWidth)) / 2);
                    }
                    if(nHeight > 0)
                    {
                        if(nHeight.indexOf("%") > -1)
                        {
                            nHeight = nHeight.trimEnd("%");
                            nHeight = Math.floor(parseInt($(window).height()) * (parseInt(nHeight) / 100));
                            
                        }
                        nTop = Math.floor((parseInt($(window).height()) - parseInt(nHeight)) / 2);
                    }
                                        
                    //alert( $(window).width() + "  "  +  $(window).height())
                    //alert(nWidth + "  " + nHeight)
                    // refresh after the close modal window 
                    hash.refreshAfterClose = true;
                    //alert(bRefresh)
                    if(bRefresh == false || bRefresh == "false")
                        hash.refreshAfterClose = false;
                
                    $modal.show();
                    $modal.css({
                        width : 0,
                        height : 0,
                        opacity : 0
                    }).animate({
                        width : nWidth,
                        height : nHeight,
                        top : nTop,
                        left : nLeft,
                        marginLeft : 0,
                        opacity : 1
                    },'slow');
                    
                    var nTemp = parseInt($('.box-tc',$modal).css("height").trimEnd("px")) + parseInt($('.box-bc',$modal).css("height").trimEnd("px"));
                    //alert(nTemp)
                    $frame.css({
                        height : nHeight - nTemp - 2
                    });
                    $modal.resize(function(){
                        var tmpHeight = parseInt($(this).height());
                        var tmpWidth = parseInt($(this).width());
                        if (tmpHeight <= (nTemp + 100)) {
                            tmpHeight = (nTemp + 100)
                            $(this).css("height",tmpHeight);
                        }
                        if(tmpWidth <= 100)
                        {
                            $(this).css("width",100);
                        }
                        $frame.css({
                            height :  tmpHeight - nTemp - 2
                        });
                    });
                };
                
                var closeFrame = function(hash){
                    var $modal = $(hash.w);
                    
                    $modal.fadeOut('2000',function(){
                        hash.o.remove();
                        //refresh parent window
                        //alert(hash.refreshAfterClose);
                        if(hash.refreshAfterClose == true){
                            window.location.href = document.location.href;
                        }
                    });
                };
                $('.box').jqm({
                    modal : true,
                    overlay : 60,
                    overlayClass : "overlayClass",
                    trigger : '.openDialog',
                    target : false,
                    onShow : OpenInFrame,
                    onHide : closeFrame
                }).jqDrag(".box-tc").jqResize(".box-bl");
                
                
                
                //test jQuery data
                $("#btnData").click(function(){
                    var $data = $("#txtData");
                    
                    var text = $data.data("text");
                    //alert(jQuery.data($data))
                    if(text)
                    {
                        if($data.val() != "" && $data.val() != text)
                            $data.data("text",$data.val());
                        alert(text);
                    }else{
                        $data.data("text",$data.val());
                        alert("sucess set the data");
                    }
                });
            });
            
            
        </script>
    </head>
    <body>
        <input type="button" value="testOver100pixels" onclick="testOver100pixels()">
        <input type="text" id="txtData">
        <input type="button" id="btnData" value="btnData" >
        <a href="dialog.htm?r=false&width=500&height=400" class="openDialog">dialog</a>
        <a href="http://samlin.cnblogs.com?r=true&width=500&height=400" class="openDialog">MyBlog</a>
        <input type="button" class="openDialog">
        <a href="http://samlin.cnblogs.com" title="Sam Lin' Blog" onclick="return navigateUrl(this)">在frame中log</a>
        <div class="box" style="width:400px;height:550px;position:absolute;">
            <div class="box-tl">
                <div class="box-tr">
                    <div class="box-tc">
                        </div>
                </div>
            </div>
            <div class="box-ml">
                <div class="box-mr">
                    <div class="box-mc">
                        <iframe src="" id="ifrContent" frameborder="0">
                        </iframe>
                    </div>
                </div>
            </div>
            <div class="box-bl">
                <div class="box-br">
                    <div class="box-bc">
                        dfdf
                    </div>
                </div>

            </div>
            <div class="box-tool jqmClose">
                <a href="#"></a>
            </div>
        </div>
    </body>
</html>

From Sam Lin

Technorati 标签: Windows Live Writer

转载于:https://www.cnblogs.com/samlin/archive/2009/01/10/1373313.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值