jquery 淡入淡出效果的简单实现


Posted in Javascript onFebruary 07, 2014

样式:

 <style type="text/css">
      #win {      
        width: 98%;     
        position: absolute;          
        display: none;  
        float:left;  
        }    
           

        /*控制关闭按钮的位置*/
        #close {
         margin-left: 155px;
         cursor: pointer;
        }
    </style>

JS代码:
 <script  type="text/javascript">
    function showwin() {
        $("#win").fadeIn("slow");
       }
    function hide() {
       $("#win").fadeOut("slow");
      }
</script>

html代码:
 <div id="win">   
            <div id="title">   
                <table  style="width:100%; background:#78b3ef"  cellpadding="4" cellspacing="1" >
                  <tr>
                     <td>ID</td>
                     <td>网站名</td>
                     <td>域名</td>
                     <td>百度收录</td>
                     <td>是否存在链接</td>
                     <td>操 作  <span id="close" onclick="hide()">关闭</span>   </td>
                  </tr>
                  <tr  style="background:#FFFFFF;">
                     <td><span id="w_id"></span></td>
                     <td><input id="txt_title" type="text" style="width: 237px" /></td>
                     <td><input id="txt_classurl" type="text" style="width: 259px" /></td>
                     <td><span id="w_baidu"></span></td>
                     <td><input id="txt_exist" type="text" style="width: 83px" /></td>
                     <td><input id="Button1" type="button" value="修 改" onclick="w_modify()" /></td>
                  </tr>
                  <tr style="background:#FFFFFF;"><td colspan="6"><a href="Default.aspx">返回首页</a></td></tr>
               </table>
            </div>   
        </div>  
Javascript 相关文章推荐
javascript学习笔记(二)数组和对象部分
Sep 30 Javascript
Javascript毫秒数用法实例
Feb 05 Javascript
JS实现双击编辑可修改状态的方法
Aug 14 Javascript
js检测用户输入密码强度
Oct 22 Javascript
jQuery实现分隔条左右拖动功能
Nov 21 Javascript
js select实现省市区联动选择
Apr 17 Javascript
jquery 属性选择器(匹配具有指定属性的元素)
Sep 06 Javascript
JavaScript、C# URL编码、解码总结
Jan 21 Javascript
Node.js环境下Koa2添加travis ci持续集成工具的方法
Jun 19 Javascript
简单谈谈React中的路由系统
Jul 25 Javascript
使用jquery DataTable和ajax向页面显示数据列表的方法
Aug 09 jQuery
基于AngularJs select绑定数字类型的问题
Oct 08 Javascript
通过遮罩层实现浮层DIV登录的js代码
Feb 07 #Javascript
做好七件事帮你提升jQuery的性能
Feb 06 #Javascript
为开发者准备的10款最好的jQuery日历插件
Feb 04 #Javascript
javascript简单性能问题及学习笔记
Feb 04 #Javascript
JavaScript初学者建议:不要去管浏览器兼容
Feb 04 #Javascript
21个值得收藏的Javascript技巧
Feb 04 #Javascript
Javascript 按位与运算符 (&amp;)使用介绍
Feb 04 #Javascript
You might like
php实现的CSS更新类实例
2014/09/22 PHP
PHP跨平台获取服务器IP地址自定义函数分享
2014/12/29 PHP
php冒泡排序与快速排序实例详解
2015/12/07 PHP
PHP基于DOMDocument解析和生成xml的方法分析
2017/07/17 PHP
Yii2使用表单上传文件的实例代码
2017/08/03 PHP
php如何计算两坐标点之间的距离
2018/12/29 PHP
php常用字符串长度函数strlen()与mb_strlen()用法实例分析
2019/06/25 PHP
TimergliderJS 一个基于jQuery的时间轴插件
2011/12/07 Javascript
JS文本框默认值处理详解
2013/07/10 Javascript
JS 排序输出实现table行号自增前端动态生成的tr
2014/08/13 Javascript
javascript实现的一个随机点名功能
2014/08/26 Javascript
小结Node.js中非阻塞IO和事件循环
2014/09/18 Javascript
jQuery实现dialog设置focus焦点的方法
2015/06/10 Javascript
将页面table内容与样式另存成excel文件的方法
2015/08/05 Javascript
为什么JavaScript没有块级作用域
2016/05/22 Javascript
JavaScript利用Date实现简单的倒计时实例
2017/01/12 Javascript
详解如何使用Vue2做服务端渲染
2017/03/29 Javascript
js时间查询插件使用详解
2017/04/07 Javascript
ztree简介_动力节点Java学院整理
2017/07/19 Javascript
AngularJS 实现购物车全选反选功能
2017/10/24 Javascript
vue 中滚动条始终定位在底部的方法
2018/09/03 Javascript
详解离线安装npm包的几种方法
2018/11/25 Javascript
JavaScript this绑定过程深入详解
2018/12/07 Javascript
JS实现数据动态渲染的竖向步骤条
2020/06/24 Javascript
[03:49]2016完美“圣”典风云人物:AMS专访
2016/12/06 DOTA
[05:15]2018年度CS GO社区贡献奖-完美盛典
2018/12/16 DOTA
离线安装Pyecharts的步骤以及依赖包流程
2020/04/23 Python
Python3实现将一维数组按标准长度分隔为二维数组
2019/11/29 Python
python 弧度与角度互转实例
2020/04/15 Python
python中upper是做什么用的
2020/07/20 Python
python爬取网易云音乐热歌榜实例代码
2020/08/07 Python
调解协议书
2014/04/16 职场文书
2014年秋季开学典礼主持词
2014/08/02 职场文书
民政局副局长民主生活会个人对照检查材料
2014/09/19 职场文书
依法行政工作汇报
2014/10/28 职场文书
初中教师个人总结
2015/02/10 职场文书