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 相关文章推荐
jquery异步循环获取功能实现代码
Sep 19 Javascript
jQuery Validate表单验证插件 添加class属性形式的校验
Jan 18 Javascript
JavaScript学习笔记整理之引用类型
Jan 22 Javascript
jquery ajax局部加载方法详解(实现代码)
May 12 Javascript
浅谈gulp创建完整的项目流程
Dec 20 Javascript
详解使用webpack构建多页面应用
Dec 21 Javascript
Vue 父子组件数据传递的四种方式( inheritAttrs + $attrs + $listeners)
May 04 Javascript
用element的upload组件实现多图片上传和压缩的示例代码
Feb 12 Javascript
原生js实现抽奖小游戏
Jun 27 Javascript
jQuery - AJAX load() 实例用法详解
Aug 27 jQuery
nuxt+axios实现打包后动态修改请求地址的方法
Apr 22 Javascript
Node.JS如何实现JWT原理
Sep 18 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
星际争霸 Starcraft 编年史
2020/03/14 星际争霸
用php解析html的实现代码
2011/08/08 PHP
PHP之将POST数据转化为字符串的实现代码
2016/11/03 PHP
PHPMailer ThinkPHP实现自动发送邮件功能
2018/06/10 PHP
PHP获取ttf格式文件字体名的方法示例
2019/03/06 PHP
gearman中worker常驻后台,导致MySQL server has gone away的解决方法
2020/02/27 PHP
ejs v9 javascript模板系统
2012/03/21 Javascript
解析JSON对象与字符串之间的相互转换
2013/12/18 Javascript
JavaScript对象数组的排序处理方法
2015/10/21 Javascript
jquery html动态添加的元素绑定事件详解
2016/05/24 Javascript
JS之获取样式的简单实现方法(推荐)
2016/09/13 Javascript
详解js界面跳转与值传递
2016/11/22 Javascript
Vue.js路由vue-router使用方法详解
2017/03/20 Javascript
基于vue中css预加载使用sass的配置方式详解
2018/03/13 Javascript
微信小程序实现图片滚动效果示例
2018/12/05 Javascript
nvm、nrm、npm 安装和使用详解(小结)
2019/01/17 Javascript
JS函数基本定义与用法示例
2020/01/15 Javascript
js加减乘除精确运算方法实例代码
2021/01/17 Javascript
Python的requests网络编程包使用教程
2016/07/11 Python
python3基于OpenCV实现证件照背景替换
2018/07/18 Python
详解Python安装tesserocr遇到的各种问题及解决办法
2019/03/07 Python
Python中如何导入类示例详解
2019/04/17 Python
Python数据持久化存储实现方法分析
2019/12/21 Python
python将图片转base64,实现前端显示
2020/01/09 Python
对Tensorflow中tensorboard日志的生成与显示详解
2020/02/04 Python
Pytorch 使用opnecv读入图像由HWC转为BCHW格式方式
2020/06/02 Python
浅谈python量化 双均线策略(金叉死叉)
2020/06/03 Python
在keras里面实现计算f1-score的代码
2020/06/15 Python
利用python3筛选excel中特定的行(行值满足某个条件/行值属于某个集合)
2020/09/04 Python
中英文自我评价常用句型
2013/12/19 职场文书
艺术学院毕业生自我评价
2014/03/02 职场文书
少先队入队仪式主持词
2015/07/04 职场文书
人生哲理妙语30条:淡写流年,笑过人生
2019/09/04 职场文书
Matlab求解数组中的最大值及它所在的具体位置
2021/04/16 Python
详解Vue slot插槽
2021/11/20 Vue.js
电脑无法安装Windows 11怎么办?无法安装Win11的解决方法
2021/11/21 数码科技