标签: fade

JQuery帮助 - 动画背景颜色

使用JQuery,我想要做的是创建一个函数,当我调用函数时,它会将我的"#page"DIV的背景颜色从CSS定义的背景颜色淡化为黄色然后再回到原始的CSS背景颜色#页.

关于如何使用JQuery执行此操作的任何想法?

我知道JQuery既有"动画"又有"高亮"功能.看来"亮点"可能是合适的选择,但我不确定.

谢谢

javascript jquery highlighting fade background-color

13
推荐指数
4
解决办法
2万
查看次数

在向下滚动时淡入,在向上滚动时淡出 - 基于窗口中的元素位置

当它们在窗口中完全可见时,我试图让一系列元素在向下滚动时淡入.如果我继续向下滚动,我不希望它们淡出,但如果我向上滚动,我确实希望它们淡出.

这是我发现的最接近的jsfiddle. http://jsfiddle.net/tcloninger/e5qaD/

$(document).ready(function() {

/* Every time the window is scrolled ... */
$(window).scroll( function(){

    /* Check the location of each desired element */
    $('.hideme').each( function(i){

        var bottom_of_object = $(this).position().top + $(this).outerHeight();
        var bottom_of_window = $(window).scrollTop() + $(window).height();

        /* If the object is completely visible in the window, fade it it */
        if( bottom_of_window > bottom_of_object ){

            $(this).animate({'opacity':'1'},500);

        }    
    }); 
}); 
});
Run Code Online (Sandbox Code Playgroud)

它完全按照我想要的向下滚动,但如果我向上滚动它们,我也希望元素淡出.

我试了这个没有运气.

            if( bottom_of_window > bottom_of_object ){

                $(this).animate({'opacity':'1'},500);  

            } else {

               $(this).animate({'opacity':'0'},500); }
Run Code Online (Sandbox Code Playgroud)

非常感谢您花时间看这个.

javascript jquery scroll fade

13
推荐指数
2
解决办法
8万
查看次数

反应淡化元素

我有一个Basket组件需要BasketContents在单击时切换组件.这有效:

constructor() {
    super();
    this.state = {
      open: false
    }
    this.handleDropDown = this.handleDropDown.bind(this);
  }
  handleDropDown() {
    this.setState({ open: !this.state.open })
  }
    render() {
        return(
            <div className="basket">
                <button className="basketBtn" onClick={this.handleDropDown}>
                    Open
                </button>
              {
                this.state.open
                ?
                <BasketContents />
                : null
              }
            </div>
        )
    }
Run Code Online (Sandbox Code Playgroud)

它使用条件来显示BasketContents组件与否.我现在希望它淡入.我尝试添加一个ComponentDidMount钩子BasketContents来转换不透明度,但这不起作用.有一个简单的方法吗?

javascript css fade reactjs

13
推荐指数
2
解决办法
2万
查看次数

Andengine淡入/淡出和alpha修饰符不起作用

我有AndEngine GLES2的问题.

我有这个代码:

Sprite black = new Sprite(0,0, blackRegion, this.getVertexBufferObjectManager());
black.setSize(CAMERA_WIDTH, CAMERA_HEIGHT);

black.registerEntityModifier(new AlphaModifier(2, 0, 255));

mScene.attachChild(black);
Run Code Online (Sandbox Code Playgroud)

所以它不起作用.什么都没有......

我需要做什么?

android alpha fade andengine andengine-gles-2

12
推荐指数
1
解决办法
7095
查看次数

基于滚动条位置的Div不透明度

找到如何淡出的例子div,当滚动条达到一定的位置在这里.但这不是一个平滑的节流型褪色.这是来自jsfiddle的代码:

var divs = $('.social, .title');
$(window).scroll(function(){
   if($(window).scrollTop()<10){
         divs.fadeIn("fast");
   } else {
         divs.fadeOut("fast");
   }
});?
Run Code Online (Sandbox Code Playgroud)

我希望不透明度百分比能够反映滚动条的位置.例如,当滚动条位于最顶部位置时,div不透明度为100%.当我向下滚动35px时,我希望div的不透明度渐渐下降到0%

也许一种技术可能是当div A距离顶部35px时,div B = 100%不透明度.当div A从顶部开始为0px时,div B = 0%不透明度.并且在两者之间的所有阶段都能顺利淡出.

谢谢!

更新:感谢所有帮助他们中的大多数工作相当不错,但我真的需要它在35px范围内工作.所以我创建了一个新的例子,它将非常清楚它应该如何工作.
http://jsfiddle.net/J8XaX/1/

更新2:移动设备:我在我的iPhone上试过这个并且淡入淡出效果不顺畅.它的工作方式是如果你中途滑动并松开手指,那么不透明度就会下降.但是如果你试图平滑滚动它会从100%不透明度直接变为0%不透明度.想知道是否有办法解决这个问题?

谢谢!!

javascript jquery fade scrollbar opacity

12
推荐指数
2
解决办法
3万
查看次数

每30秒更换一次背景颜色(淡入淡出过渡)

我希望有人告诉我,制作网页背景颜色(整个页面的背景颜色)的代码是什么,每30秒更改一次(淡入淡出过渡)到给定的颜色种类.这很简单吗?我猜css会让它变得更容易吗?

我在网上搜索过,我发现渐变不是我想要的.先感谢您.我搜索了codepen和jsfiffle的例子,但没有人有这么简单:/

示例:在浏览我的页面时,我希望背景颜色从蓝色变为绿色,然后变为橙色,再次变为蓝色,依此类推...... :)

css background colors fade css-transitions

12
推荐指数
3
解决办法
3万
查看次数

jQuery:淡化模态对话框

是否可以平滑地淡化jquery模式对话框?(在文档中找不到任何内容).我试过fadeTo但没有帮助.

jquery dialog modal-dialog fade

11
推荐指数
1
解决办法
2万
查看次数

使用JQuery慢慢更改/淡化/动画图像

这是我的img, <img src="one.png" id="one" onMouseOver="animateThis(this)">

当用户将鼠标悬停在使用jQuery时,我想慢慢将此图像src更改为"oneHovered.png".哪种jQuery方法最好这样做?我看到很多例子都希望我改变CSS背景.有什么可以直接改变src属性吗?

jquery image fade src jquery-animate

11
推荐指数
1
解决办法
4万
查看次数

iOS SDWebImage淡入新图像

我一直在我的iPhone应用程序上使用SDWebImage来处理所有图像加载.我正在使用占位符图像,并且我想在加载后对新图像进行交叉淡入淡出或淡入淡出.我使用成功块来设置图像,它工作得很好.无论我尝试什么,图像都不会淡入.我已经尝试将动画代码发送回主线程,但这也无济于事.它只是立即加载......没有动画.

这是我的代码.有什么想法吗?

// load placeholder image
NSURL *url = ...
_imageView = [[UIImageView alloc] init];
[_imageView setImage:[UIImage imageNamed:@"loading.jpg"]];

// request image
SDWebImageManager *manager = [SDWebImageManager sharedManager];
[manager downloadWithURL:url
                delegate:self
                 options:0
                 success:^(UIImage *image) {

                     [UIView transitionWithView:_imageView
                                       duration:3.0
                                        options:UIViewAnimationOptionTransitionCrossDissolve
                                     animations:^{
                                         [_imageView setImage:image];
                                     } completion:NULL];

}
failure:nil];
Run Code Online (Sandbox Code Playgroud)

asynchronous image fade ios sdwebimage

11
推荐指数
4
解决办法
1万
查看次数

纯JavaScript淡入功能

嗨朋友,当我点击另一个div时,我想淡入div,为此我使用下面的代码. 代码1工作正常,但我需要用代码2.

我知道有jQuery,但我需要在JavaScript中执行此操作

你能指导我,我正在做什么样的错误,或者我需要改变什么......

Code1 ---工作正常

function starter() { fin(); }

function fin()
{
    for (i = 0; i <= 1; i += 0.01)
    {
        i=Math.round(i*100)/100;
        setTimeout("seto(" + i + ")", i * 1000);
    }
}

function seto(opa)
{
    var ele = document.getElementById("div1");
    ele.style.opacity = opa;
}
Run Code Online (Sandbox Code Playgroud)

Code2 ---不起作用

function starter()
{
    var ele = document.getElementById("div1");
    fin(ele);
}
function fin(ele)
{
    for (i = 0; i <= 1; i += 0.01)
    {
        i=Math.round(i*100)/100;
        setTimeout("seto(" + ele + …
Run Code Online (Sandbox Code Playgroud)

javascript fade fadein

11
推荐指数
2
解决办法
3万
查看次数