弹出消息框问题

消息框

解决方案 »

  1.   

    你的代码没细看，看你描述，应该是定位问题，那个弹窗你试一下定位：position:fixed;
      

  2.   

    http://demo.jb51.net/js/2011/artDialog/_doc/API.html    这个插件可以实现。在这个页面搜 “创建一个右下角浮动的消息窗口”  这个例子就是提示的
      

  3.   


    #Msg{
        position:fixed;
        bottom:0;
        right:0;
    }
    这个知道用到你的弹窗里吧
      

  4.   

    补充：你js有关定位的代码注释掉，然后加上那css;
    很简单的功能，js就控制css属性display="none"不显示，display="block"显示
      

  5.   

    <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
    <script language="javascript">
        function ShowMessage(width,height,bottom) {
            typeof bottom=='undefined'?bottom=50:0;
            var TopY=0;//初始化元素距父元素的距离
            $("#mymessage").css("width",width+"px").css("height",height+"px");//设置消息框的大小
            $("#mymessage").slideDown(1000);//弹出
            $("#message_close").click(function() {//当点击关闭按钮的时候
                if(TopY==0){
                    $("#mymessage").slideUp(1000);//这里之所以用slideUp是为了兼用Firefox浏览器
                }
                else
                {
                    $("#mymessage").animate({top: TopY+height}, "slow", function() { $("#mymessage").hide(); });//当TopY不等于0时  ie下和Firefox效果一样
                }
            });
            $(window).scroll(function() {
                $("#mymessage").css("top", $(window).scrollTop() + $(window).height() - $("#mymessage").height()-bottom);//当滚动条滚动的时候始终在屏幕的右下角
                TopY=$("#mymessage").offset().top;//当滚动条滚动的时候随时设置元素距父原素距离
            });
        }
        $(function(){
            ShowMessage(252,166);
        })
    </script>
    <style type="text/css">
        #mymessage{
            right: 0px;
            margin-bottom:0px;
            bottom: 50px;
            position: absolute;
            z-index: 999;
            display:none;
        }
    </style>
    <div id="mymessage">
        <a id="message_close" title="点击关闭" href="javascript:void(0);"><div id="mes_close" style="background-image:url(tpl/window/top.jpg); width:252px; height:22px; background-repeat:no-repeat;"></div></a>
        <a href="index.php?c=pro&a=show&id=<?=$rs[links]?>" target="_blank" style="text-decoration: none;">
            <table width="250" height="144" border="0" cellpadding="0" cellspacing="0" style="background-image:url(tpl/window/moban.jpg); background-repeat:no-repeat;">
                <tr>
                    <td height="30" align="center" style="color:#304759; font-size:14px; font-weight:bold"><?=$rs[title]?></td>
                </tr>
                <tr>
                    <td align="left" valign="top"><table width="252" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                            <td width="98" align="center" style="text-align:center; padding-left:5px"><img src="<?=$rs[picurl]?>" width="80" height="80" border="0" /></td>
                            <td width="152" align="left" valign="top" style="color:#304759; font-size:12px;">    <?=$rs[content]?></td>
                        </tr>
                    </table></td>
                </tr>
            </table>
        </a>
    </div>
    <div style="height: 2500px"></div>
      

  6.   

    以前答题时候有个类似的代码。
    对于这些自适应位置和坐标计算的东东，不用jquery会累死人的
      

  7.   


    就这样设置position，将弹框div放置到body的下面，作为子节点，不要深了。理解position，想让他显示在哪，他就得在哪！！！
      

  8.   


    就这样设置position，将弹框div放置到body的下面，作为子节点，不要深了。理解position，想让他显示在哪，他就得在哪！！！我现在就是显示在右下角，就是滚动条的长度会加上的