求jquery右下角弹出多个消息提示框代码

如题！

解决方案 »

  1.   

    http://dotnet.aspx.cc/CodeLab/Default.aspx
      

  2.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>消息框</title>    <script src="jquery-vsdoc.js" type="text/javascript"></script>    <script src="jquery.js" type="text/javascript"></script>    <script src="MessageDialog.js" type="text/javascript"></script>    <script type="text/javascript">
             if(<%=IsMessage %>==1)
             {
         $(document).ready(function() {
            $("#message1").Show(256,185);
            $("#message2").Show(256,373);
            $("#message3").Show(256,561);
         });
         }
         
        </script></head>
    <body>
        <form id="form1" runat="server">
        <div>
        </div>
        <div id="message1" style="z-index: 100; position: absolute; display: none; bottom: 0;
            right: 0; overflow: hidden;">
            <div id="backimage">
                <img src="tips_bg.jpg" alt="这是一张图片" /></div>
            <div style="width: 100%; height: 25px; overflow: hidden;" id="messageTool">
                <div style="padding: 3px 0 0 35px; width: 100px; line-height: 20px; text-align: center;
                    overflow: hidden; position: absolute;" id="msgtitle">
                    <%=MessageTitle %>
                </div>
                <span id="message_close" style="right: 10px; width: 16px; text-align: center; cursor: pointer;
                    position: absolute;">×</span>
                <div style="clear: both;">
                </div>
            </div>
            <div id="message_content" style="margin: 0 5px 0 5px; padding: 10px 0 10px 5px; width: 239px;
                height: 135px; text-align: left; overflow: hidden;">
                <%=MessageContect%>
            </div>
        </div>
        
        <div id="message2" style="z-index: 100; position: absolute; display: none; bottom: 0;
            right: 0; overflow: hidden;">
            <div id="Div2">
                <img src="tips_bg.jpg" alt="这是一张图片" /></div>
            <div style="width: 100%; height: 25px; overflow: hidden;" id="Div3">
                <div style="padding: 3px 0 0 35px; width: 100px; line-height: 20px; text-align: center;
                    overflow: hidden; position: absolute;" id="Div4">
                    <%=MessageTitle %>
                </div>
                <span id="Span1" style="right: 10px; width: 16px; text-align: center; cursor: pointer;
                    position: absolute;">×</span>
                <div style="clear: both;">
                </div>
            </div>
            <div id="Div5" style="margin: 0 5px 0 5px; padding: 10px 0 10px 5px; width: 239px;
                height: 135px; text-align: left; overflow: hidden;">
                <%=MessageContect%>
            </div>
        </div>
        
        <div id="message3" style="z-index: 100; position: absolute; display: none; bottom: 0;
            right: 0; overflow: hidden;">
            <div id="Div7">
                <img src="tips_bg.jpg" alt="这是一张图片" /></div>
            <div style="width: 100%; height: 25px; overflow: hidden;" id="Div8">
                <div style="padding: 3px 0 0 35px; width: 100px; line-height: 20px; text-align: center;
                    overflow: hidden; position: absolute;" id="Div9">
                    <%=MessageTitle %>
                </div>
                <span id="Span2" style="right: 10px; width: 16px; text-align: center; cursor: pointer;
                    position: absolute;">×</span>
                <div style="clear: both;">
                </div>
            </div>
            <div id="Div10" style="margin: 0 5px 0 5px; padding: 10px 0 10px 5px; width: 239px;
                height: 135px; text-align: left; overflow: hidden;">
                <%=MessageContect%>
            </div>
        </div>
        </form>
    </body>
    </html>可以从后台判断是否提示，以及动态加载提示信息。
      

  3.   

    孟子大哥，你的那个消息框有点小BUG，我在FF下会跑到浏览器上面去
      

  4.   

    本帖最后由 net_lover 于 2010-10-27 14:17:16 编辑