jQuery动画的div的绝对位置在IE 7中不起作用

时间:2011-09-19 17:48:45

标签: jquery internet-explorer animation

以下代码由页面顶部的3个标签调用。该页面是一系列缩略图,通过单击标记(http://parlaycreative.com/work)进行过滤。此功能在Win和OSX上的SF和FF中工作正常,但在IE中则不行。在IE中,第一次单击a时代码正常工作,但是第二次s已经淡出时代码不起作用。 IE是否在使用display:none?

选择元素时遇到问题
jQuery(document).ready(function() {
//Align objects in grid
    moveProjects('', 0);

// filter project previews on click
jQuery('.category-filter').mouseup(function() {
    var filter_string = '';

    // toggle .active state of fitler links
    if ( jQuery(this).is('.active')) {
        jQuery(this).removeClass('active');
    } 
    else {
        jQuery(this).addClass('active');
    }

    jQuery('.category-filter').each(function(index) {
        if(jQuery(this).is('.active')) {
            filter_string += '.' + jQuery(this).text().toLowerCase() + ',';
        }
    });

    // Remove trailing comma
    filter_string = filter_string.substring(0, filter_string.length-1);

    // Fade .project-preview-wrapper if inactive types
    jQuery('.project-preview-wrapper').not(filter_string).fadeOut('fast');

    setTimeout(moveProjects, 250, filter_string, 500);
});

// Set aboslute position of .project-preview-wrapper in grid
function moveProjects (filter_string, time) {
    var cur_item = 0;
    var num_cols = 4;
    var num_rows = 0;
    var preview_width = 150;
    var preview_height = 150;
    var margin = 9;

    jQuery('.project-preview-wrapper').each(function (index) {
        var left_val = margin * (cur_item % num_cols) + preview_width * (cur_item % num_cols);
        var top_val = num_rows * (preview_height + margin);
        if (jQuery(this).css('display') != 'none') {
            jQuery(this).animate({'left':left_val,'top':top_val}, time);
            if (cur_item % num_cols == 3) {
                num_rows ++;
            }
            cur_item++;
        }
        else if (jQuery(this).is(filter_string) || filter_string == '') {
            jQuery(this).animate({'left':left_val,'top':top_val}, 0).delay(time).fadeIn('fast');
            if (cur_item % num_cols == 3) {
                num_rows ++;
            }
            cur_item++;
        }
     });
    num_rows = Math.ceil(cur_item / num_cols);
    jQuery('.view-id-work').animate({'height':(num_rows) * (preview_height + margin)},time);
};  
});

0 个答案:

没有答案