Tag: fadein

jQuery li，背景中淡化图像（淡入淡出）

我目前正在使用此代码： var gallery = $(‘ul#gallery’).children(); $(gallery).filter(‘:even’).not(‘:last’).hover(function () {$(this).toggleClass(‘next’)}); 我试图让它淡入这个新课程。目前，有一个 ，里面有一个图像，没有背景。 当添加“下一个”类时，它会在hover时为其提供背景图像。 有没有办法在不使图像闪烁/褪色的情况下淡入新课程？

当滚动条击中另一个div的底部时淡出div

这个问题与这个问题有关： 当URL hash＃changes时，将div添加到body 我正在使用Curtain.js，目前我有一个固定的div，当哈希值发生变化时弹出。 IE当用户向下滚动页面到不同的面板时，div淡入。 我不希望在第一个面板上看到这个div。 我现在遇到的问题是，当访问者向上滚动页面到顶部时，固定div仍然可见。 即出现在第一个面板的顶部。 一旦它碰到第一个面板的底部，我想淡出那个div。 另一个问题是面板的高度调整到浏览器窗口的高度（流畅/响应式布局）排除任何固定像素JS解决方案，这是我的代码基于： // fade in/fade out banner titles $(window).trigger(‘scroll’); var divs = $(‘.nav-wrap’); $(window).scroll(function(){ if($(window).scrollTop() < 550){ divs.fadeOut("slow"); } else { divs.fadeIn("slow"); } }); 任何人都有任何建议？

jQuery fadeIn（）具有多个div的不同间隔

我有一个有六个div的主页。 它们是不同形状的盒子，我希望它们在页面加载时以随机间隔淡入。 javascript代码如下： $(document).ready(function(){ $(“#topleft”).fadeIn(2000).animate({opacity: 1.0}); }); 当然，我需要将所有六个div作为目标，而不仅仅是一个，我希望它们在页面加载后大约3秒内随机淡入。 我怎么会这样呢？ 顺便说一下，我正在使用jQuery，因为我是新手，我可能会使用一些我不知道的东西。

如何在使用jQuery淡入淡出选项显示或隐藏元素时阻止页面跳转到顶部

有很多问题，我试过了。 我在做什么 我正在使用jQuery fadeIn和fadeOut选项隐藏div并使用下面的jquery显示列表，但页面一直跳到顶部。 将显示的列表是动态的。 我试过e.preventDefault(); 并return false; 但没用 我尝试将锚标记更改为span标记，但第二个onClick函数不起作用。 这是因为我的内容长度是动态的，使它看起来像跳跃还是真正的跳跃？ 提前致谢。 HTML 20 CATEGORIES 1 Chef’s Special Lunch Snacks Dinner JS $(document).ready(function(){ $(‘body’).on(‘click’, ‘.category’, function(){ var category = $(this).data(‘categories’); //alert(category); $(‘.category’).fadeOut(300); $.ajax({ type: “POST”, url: “./assets/listproducts.php”, data: {cat: category}, cache: false, success: function(response){ //console.log(response); $(‘#nav’).html(‘<- BACK').addClass('back'); $('.items').html(response).delay(400).fadeIn(300); } }); }); $('.back').on('click', function(e){ $('.items').fadeOut(300); $('.category').html(response).delay(400).fadeIn(300); […]

jQuery fadeIn在Firefox中闪烁

我在用户点击后使用fadeIn扩展表中的行。 在Chrome甚至IE中，一切都正常，但它在Firefox 15.0.1中不起作用。 在FF中，扩展行褪色后，它的背景闪烁一次。 这是我的代码： $(‘.patients-items-item’).click(function() { var item = $(this).next(‘.toggle-item’); if (item.is(“:visible”)) { item.hide(); } else { item.fadeIn(); } }); HTML： Text Text2 Text3 看看小提琴 。 在调查期间，我发现这种行为仅存在于表格中。 如果我使用divs执行相同的代码将在所有浏览器中正常工作。 任何建议都会有所帮助。

在Chrome中淡化大图像

我在渲染大图像方面遇到了一些麻烦，但仅限于Chrome。 这是绝对基本的设置： $（文件）。就绪（函数（）{ var img = new Image（）; $（IMG） 。隐藏（） .load（函数（）{ $（本）.fadeIn（3000） }） .attr（“src”，“files / originals / 01.jpg”） $（ “身体”）。追加（IMG） }）; 据我所知，这是创建动态图像的常规方法，加载它，并在加载完成后淡入淡出。 现在，这在FireFox，Safari甚至IE中完美运行，但在使用大图像（分辨率大于1900×1200）时不适用于Chrome。 在有人大火之前，我应该补充一点，这是项目的要求。 在所有浏览器中都会发生什么，但Chrome会在图像加载（预期）时出现延迟，并且一旦完成就会消失。在Chrome中，我会在图像加载时获得常规延迟，然后在图像加载期间再次延迟fadeIn（在我的例子中为3000ms）之后，图像只是“出现”，好像我使用了show（）。 较小的图像可以在所有浏览器中完美运行。 是什么赋予了？ 我错过了什么？

jquery在hover时淡出淡出多个元素

我正在开发一个投资组合页面，并希望当用户将鼠标hover在项目上时，使用jquery在图像上淡入一些信息。 我对后端jquery的东西很新，所以刚开始弄脏我的手。 我已经设法让淡入淡出和单独的div元素工作，但我需要它为每一个独立工作。 我认为这需要一些更动态的代码，但我不知道从哪里开始。 如果你看下面我有一个适用于一个项目的代码。 将鼠标hover在第一张图像上时会出现div。 这是我需要的结构，因为真正的投资组合具有这种基本结构。 我只需要代码就可以让其他两个代码工作。 现场将有多个hover。 Robs Test body{background:gray;} div{position:relative;} #box{ position:relative; width:150px; height:150px; float:left; display:block; background:black; margin-right:20px; } #boxover{ position:absolute; top:10px; left:0px; width:100%; height:20px; z-index:100; background:white; display:none; } $(function(){ $(‘#box’).hover(over, out); }); function over(event) { $(‘#boxover’).fadeIn(2000); $(‘#boxover’).css(“display”,”normal”); } function out(event) { $(‘#boxover’).fadeOut(2000); } hello there rob 如果有人能告诉我如何使每个人独立工作那将是伟大的。 我猜一个像灯箱一样的rel属性？ 我很高兴为每个图像分别设置一个id / rel。 […]

onClick事件问题后fadeOut div

这是我第一次在这里发帖，并且在我找到该网站后的几周内已经阅读了很多有用的东西！ 所以，我的问题是：我的网站上有以下代码，我想做的是…… 单击元素（.btn-leavecomment）时 通过slideDown显示隐藏的div（#commenttype）。 这个隐藏的div包含两个单选按钮。 点击/选择’第一个’单选按钮（.reveal_ccform）我想要显示另一个隐藏的div（我有这一切都在这里工作） 然后我喜欢第一个隐藏的div（包含单选按钮（#commenttype））然后消失和fadeOut（一旦用户只选择了两个中的第一个单选按钮。第二个单选按钮重定向到另一个页面以防万一你想知道。） 点击第一个单选按钮，任何人都可以帮助获得最后一点（fadeOut第一个隐藏的div）吗？ 谢谢 我的代码： $(document).ready(function(){ // Click first element (.btn-leavecomment) // and reveal first hidden DIV (#commenttype) $(“.btn-leavecomment”).toggle(function(){ $(“#commenttype”).stop().animate({ down: “+=300” }, 3000) $(“#commenttype”).stop().slideDown(“slow”); }, function(){ $(“#commenttype”).stop().animate({ down: “-=300” }, 1400) $(“#commenttype”).stop().slideUp(“slow”); }); // on click of first radio (.reveal_ccform) // Reveal second hidden DIV (ccform_container) $(“.reveal_ccform”).toggle(function(){ $(“#ccform_container”).stop().animate({ down: […]

事件未触发（或正确形成）后的FlexSlider

我正在使用Flexslider为一系列滚动幻灯片制作动画。 它在并且正常工作。 我现在要做的是利用’after：’回调来淡化幻灯片中的标题。 就运行顺序而言，它看起来像这样： 幻灯片（包含背景图片）淡入。 暂停（1秒）。 标题淡入。 我在’after：’事件旁边使用了以下function，你不知道它，它不起作用。 标题已设置为显示：无; 但从未表现出来（是的，我的时机很好）。 after: function(){$(‘.headline’).fadeIn(500);}, HTML： Headline text goes here 指导将不胜感激。 谢谢，@ rrfive

IE7 / 8＆png的fadeIn / fadeOut jquery问题

嘿伙计们，我正在尝试制作放大镜背景，当使用hover在可以放大的图像上时。 这是使用空白跨度并将其显示设置为无，直到它hover，并使其背景为半透明png，中间放大镜。 这是使用fadeIn / fadeOut完成的，并且在IE之外的所有其他浏览器中都能很好地工作。 在IE中，图像的背景闪烁为深灰色，然后在hover时淡入正确的图像并将其hover。 这是我正在研究的例子，它连续三个较小的图像： http://www.brainbuzzmedia.com/themes/amplify/html/index.html 我已经读过，解决这个问题的方法是为褪色的元素添加背景颜色，但显然这不起作用，因为我需要使用半透明的png作为背景。 任何人都知道我能用这个做什么？