小编Jim*_*nny的帖子

在Chrome上使用display:none重置GIF动画的正确方法

标题是不言自明的,但我将逐步提供有关此事的观点.希望我不是第一个注意到Webkit/Chrome上这个(显然)错误的人.

我想重置一个GIF动画.到目前为止我见过的所有例子都只是简单地将src图像设置为自身,或者将其设置为空字符串,然后src再将其设置为原始字符串.

看看这个JSFiddle以供参考.GIF在IE,Firefox和Chrome上完全重置.

我遇到的问题是图片display:noneGoogle Chrome上显示.

检查这个JSFiddle.在显示在页面中之前,GIF在IE和Firefox上重置得很好,但Chrome只是拒绝重置其动画!

到目前为止我尝试过的:

  • src像在小提琴中一样设置自身在Chrome中不起作用.
  • 将其设置src为空字符串并将其恢复为默认值也不起作用.
  • 在图像周围放置一个包装器,清空容器.html('')并将图像放回其中,也不起作用.
  • 在设置之前或之前更改display图像也不起作用..show().fadeIn()src

只有我已经发现迄今的解决方法是保持图像与它的默认display,并通过操纵它.animate()ING和.css()荷兰国际集团的透明度,高度和能见度在必要时模拟display:none的行为.

这个问题的主要原因(上下文)是我想在页面中淡化之前重置ajax加载器GIF.

所以我的问题是,是否有一种正确的方法来重置GIF图像的动画(这可以避免Chrome的display:none"bug")或者它实际上是一个错误?

(ps.您可以更改小提琴中的GIF以获得更合适/更长的动画gif进行测试)

html javascript jquery google-chrome animated-gif

19
推荐指数
4
解决办法
5万
查看次数

为什么我的"click"事件监听器不能用于我的删除按钮?

所以我正在尝试使用删除类创建一个我的按钮(它是通过我的javascript上的34创建的.)所以我设置了一个onclick,就像我为提交按钮做的那样,但是当它是什么时没有任何反应点击.它有一个简单的控制台日志来测试它是否正常工作.我的代码出了什么问题?

$(document).ready(function() {
    $('#movie-search-submit').on('click', function(e) {
        e.preventDefault();
        var search_term = encodeURIComponent($('#movie-title-search').val()); //gets value from element
        var select_media = encodeURIComponent($('#media-select').val());
        console.log(search_term);
        console.log(select_media);
        var url = 'https://itunes.apple.com/search?country=US&term=' + search_term + '&media=' + select_media;


        var log_response = function(response) {
            $.each(response.results, function(key, item) {

                if (item.longDescription !== undefined) {
                    populate_listings(key, item);
                }

            });
        }


        $('.delete').on('click', function(e) {
             e.preventDefault();
             console.log("test");
         });


        var populate_listings = function(key, item) {
            var result_row = '<div id="result-' + key + '" class="row"></div>';
            $('#page-container').append(result_row);
            var title = '<div class="api-result col-md-2 title"><h2>' …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery

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

标签 统计

html ×2

javascript ×2

jquery ×2

animated-gif ×1

google-chrome ×1