`
huiqinbo
  • 浏览: 344770 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

用AJAX实现淡入淡出特效(回钦波)

阅读更多
0.jquery.js我放到下面你可以下载下来
1.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
    <link type="text/css" rel="stylesheet" href="css/windowfade.css">
    <script type="text/javascript" src="jslib/jquery.js"></script>
    <script type="text/javascript" src="jslib/windowfada.js"></script>

</head>
<body>

    <a onclick="dianji()" href="#">来点击我吧!</a>

    <div id="win">  
        <div id="title">我是标题<span id="close" onclick="hide()">X</span></div>
        <div id="content">我是内容</div>
    </div>

</body>
</html>


2.
#win{
    position :absolute;
    top: 220px;
    left:400px;
    border: 1px red  solid  ;
    width:300px;
    height:400px;
    display :none;
}
#x{
    position:absolute;
    left:340px;
}
#close {
    /*使关闭按钮向右侧移动*/
    margin-left: 158px;
    /*让鼠标进入时可以显示小手,告知用户可以点击操作*/
    cursor: pointer;
}

3.
function dianji(){
    var win=$("#win");
    win.fadeIn("slow");
}
function hide(){
    var win =$("#win");
    win.fadeOut("slow");

}


出入:回钦波(QQ:444084929  个人主页:http://www.yezhong.net)
  • 大小: 15.3 KB
分享到:
评论

相关推荐

    jQuery超酷文字淡入淡出显示特效

    在本文中,我们将深入探讨"jQuery超酷文字淡入淡出显示特效"这一主题,它是一种使用reveal-it.js插件实现的动态文字展示技术。这个特效插件为网页设计带来了新颖且引人注目的视觉体验,尤其适用于创建吸引人的标题或...

    jQuery点击淡入淡出显示图片特效.zip

    在图片淡入淡出特效中,CSS3的`transition`和`opacity`属性起到了重要作用。`transition`允许我们在特定时间内平滑地改变一个或多个CSS属性,而`opacity`则用来控制元素的透明度,从而实现淡入淡出的效果。 实现这...

    Jquery淡入淡出幻灯片特效图片切换源码下载

    本篇文章将详细讲解基于jQuery实现的淡入淡出幻灯片图片切换特效。 首先,我们需要了解jQuery的核心概念。jQuery通过一个简洁的语法封装了大量的JavaScript方法,使得开发者可以更高效地实现页面元素的选择、操作和...

    jQuery淡入淡出文字动画特效.zip

    jQuery淡入淡出文字动画特效是一种常见的网页交互设计,它为网页内容的展示带来动态视觉效果,提升用户体验。这一特效的实现主要依赖于JavaScript库jQuery和一个名为`jquery.easing.1.3.js`的插件,后者提供了丰富的...

    jQuery放大缩小淡入淡出焦点图特效.zip

    本文将深入探讨"jQuery放大缩小淡入淡出焦点图特效"这一主题,该特效基于流行的slick插件实现,不仅在桌面端呈现出图片的放大缩小、淡入淡出过渡动画,还兼顾了手机移动触摸设备的兼容性,从而为用户提供一致的交互...

    基于jQuery实现淡入淡出的带文字标题图片切换焦点图特效源码.zip

    标题"基于jQuery实现淡入淡出的带文字标题图片切换焦点图特效源码.zip"表明这是一个使用jQuery库开发的图片切换效果,具有淡入淡出的过渡动画,并且在切换过程中会展示文字标题。这种类型的焦点图通常用于网站设计中...

    jQuery实现的点击淡入淡出显示图片特效源码.zip

    这段代码表示当用户点击ID为"myImage"的图片时,图片会逐渐消失,1秒钟后(1000毫秒)再逐渐出现,即实现了淡入淡出效果。 为了实现多张图片的轮流显示,可以结合数组和索引来管理图片,并使用`setTimeout()`或`...

    基于JS实现大图淡入淡出图片切换特效代码.zip

    "基于JS实现大图淡入淡出图片切换特效代码"是一个常见的网页元素,尤其适用于展示图片画廊或产品展示。这个项目利用JavaScript(可能是jQuery库)来创建一个平滑的图片切换效果,其中图片会淡入淡出,为用户带来流畅...

    基于jQuery innerfade.js插件实现的文字图片句子等淡入淡出切换特效源码.zip

    【标题】中的“基于jQuery innerfade.js插件实现的文字图片句子等淡入淡出切换特效源码”指的是一种使用JavaScript库jQuery以及innerfade.js插件来创建动态内容展示的技术。这种技术通常用于网站设计,使得文字、...

    纯css3带缩略图焦点图淡入淡出切换特效.zip

    【标题】"纯css3带缩略图焦点图淡入淡出切换特效.zip"所包含的知识点主要集中在CSS3技术和JavaScript的jQuery库上,特别是针对网页动态效果的实现。这个压缩包提供了一种使用纯CSS3实现的焦点图组件,具有缩略图导航...

    车轮网jQuery带动画效果焦点图淡入淡出轮播切换效果特效

    在这个特效中,jQuery的动画功能被充分利用,实现了图片的淡入淡出效果。通过`.fadeIn()`和`.fadeOut()`方法,可以轻松地控制元素的透明度变化,从而达到平滑过渡的效果。 接着,代码中可能包含一个`&lt;script&gt;`标签...

    slick插件实现jQuery放大缩小淡入淡出焦点图特效

    在本文中,我们将深入探讨如何使用`slick`插件创建一个功能丰富的jQuery焦点图特效,该特效包括图片的放大缩小、淡入淡出以及在移动设备上的触摸支持。`slick`是一个广泛使用的JavaScript滑块库,它提供了丰富的...

    jQuery实现图片文字淡入淡出效果

    jQuery实现图片文字淡入淡出效果的知识点涵盖了从基础的jQuery选择器和动画方法的应用,到更为复杂的动态内容加载和定时器的使用。以下是根据提供的文件内容,对所需知识点的详细解读: 1. jQuery基础: - jQuery...

    jQuery实现点击小图片淡入淡出显示大图片特效

    总的来说,jQuery实现的点击小图片淡入淡出显示大图片特效是一种常见的网页交互方式,通过结合JavaScript和CSS,可以为用户提供流畅、动态的视觉体验。通过理解并实践这种效果,开发者可以进一步提升网页的交互性和...

    左右切换个性相框淡入淡出效果.zip

    本文将详细解析"左右切换个性相框淡入淡出效果"这一jQuery Cycle相册插件,该插件利用jQuery库实现了一种优雅的图片展示方式。 jQuery Cycle相册插件是jQuery库的一个扩展,它提供了多种图片轮播和切换效果,适用于...

Global site tag (gtag.js) - Google Analytics