新浪微博好友频道进入后 “取消关注”的JQery的弹出层特效如何实现？

bestchao 2011-07-19 09:05:16

新浪微博好友频道进入后 “取消关注”的JQery的弹出层特效如何实现？最好可以贴出代码...

...全文

210 10 打赏收藏转发到动态举报

写回复

用AI写文章

10 条回复

切换为时间正序

请发表友善的回复…

发表回复

豪情 2011-07-19

打赏
举报

JS弹出层
http://www.cnblogs.com/jikey/archive/2010/08/23/1806059.html

xuexiaodong2009 2011-07-19

打赏
举报

JS制作有遮罩层的模式对话框
http://blog.csdn.net/xuexiaodong2009/article/details/6605417

bestchao 2011-07-19

打赏
举报

大家举例的都是弹出层，但是其中还有一个向上移动的状态如何实现呢，没有找到相关的属性

xuexiaodong2009 2011-07-19

打赏
举报

[Quote=引用 8 楼 bestchao 的回复:]

5楼的朋友似乎贴出来代码与描述的特效差别很大，新浪微博好友频道进入后 “取消关注”的弹出层与大家描述的有差别
[/Quote]自己修改样式就一样了

bestchao 2011-07-19

打赏
举报

5楼的朋友似乎贴出来代码与描述的特效差别很大，新浪微博好友频道进入后 “取消关注”的弹出层与大家描述的有差别

lsw645645645 2011-07-19

打赏
举报

参考：
http://jqueryui.com/demos/

zhouwei7682719 2011-07-19

打赏
举报



<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <title>Untitled Document</title>

        <script src="jquery.js" type='text/javascript'></script>

        <script>

            jQuery(function(){

                jQuery(".btn").click(

                    function(){

                        jQuery("body").append("<div class='DivMask'><iframe border='0' width='100%' height='100%' marginheight='0' marginwidth='0' scrolling='no'></iframe></div>");

                        SetCss();

                    }

                )

            });

        

            function SetCss(){

                jQuery('.DivMask').css(

                    {

                        height:document.body.clientHeight,

                        width:document.body.clientWidth,

                        "background-color": "#CCCCFF",

                        opacity:10,//兼容

                        top:"0",

                        left:"0",//0就不要px了

                        position: "absolute",//这样就不会在按钮下面了

                        "z-index":900 //这句报错，不知道为什么“after property id”，

                            //css属性中带“-”的，一律用引号"z-index"/"background-color"

                    }

                );

            }

    </script>

    </head>

    <body>

        <input id="button" type="button" class="btn" value="OK"/>

    </body>

</html>