<!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>
    <title>无标题页</title>
    <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("#res").css("left",($(window).width()-$("#res").width())/2+"px");
            $("#res").css("top",($(window).height()-$("#res").height())/2+"px");
            $("#Text1").focus(function(){
                $("#res").fadeIn();
            })
            $("#Button1").click(function(){
                $("#Text1").val($("#result").html());
                $("#res").fadeOut();
            })
            $("input[type=checkbox]").click(function(){
                if($(this).attr("checked")==true)
                    $("#result").append($(this).val()+",");
                else
                     $("#result").html($("#result").html().replace($(this).val(),""));
            })
        })
    </script>
</head>
<body style="margin:0 auto; padding:0; text-align:center;">
    <input id="Text1" type="text" style="height:20px;border:1px solid #ccc;" />
    <div id="res" style="width:300px;height:300px;border:1px solid #ccc;z-index:10; background:yellow; FILTER:alpha(opacity=30);opacity=0.3;position:absolute; display:none;">
        <input id="Button1" type="button" value="确定" /><span id="result"></span><br />
        <input id="Checkbox1" type="checkbox" value="youku"/>youku
        <input id="Checkbox2" type="checkbox" value="tudou" />tudou
        <input id="Checkbox3" type="checkbox" value="baidu" />baidu
        <input id="Checkbox4" type="checkbox" value="google" />google
    </div>
</body>
</html>

posted on 2010-10-19 12:40 sanmao 阅读(26) 评论(0)  编辑  收藏

只有注册用户登录后才能发表评论。


网站导航:
 

常用链接

留言簿(5)

随笔分类

随笔档案

搜索

  •  

最新评论

阅读排行榜

评论排行榜