2010-04-05 4 views
2

Я запускаю этот скрипт на странице, которая показывает коробку с дополнительной информацией, когда вы ее просматриваете.Как я могу остановить мерцание в Scriptaculous?

site for review

Скрипт работает отлично, за исключением Theres проблеск коробки, прежде чем он на самом деле весы. Что вызывает это? Я использую то же самое в основной навигации с тем же щелчком.

Любые идеи, вызывающие это?

//work page springing box 
$$('.box').each(function(s) { 

    var more = $(s).down(2); 
    $(s).observe('mouseenter', function(e) { 

     $(more).show(); 
     new Effect.Scale(more, 100, { 
      scaleX: false, 
      scaleY: true, 
      scaleContent: false, 
      scaleFrom: 1, 
      mode: 'absolute', 
      duration: 0.5 
     }); 

    }); 

    $(s).observe('mouseleave', function(e) { 


    new Effect.Fade(more, { 
     duration: 0.2 
    }) 

    }); 


}); 

Спасибо. Rich

  • Я должен отметить, я тестирование в Safari 4.0.4
+1

необходимо масштабировать его до 1, а затем показывать, а затем делать эффект. Кстати есть мерцание на хроме, последняя версия –

+0

Не уверен, если это то, что вы имеете в виду: $ (больше) .setStyle ({ высота: «1px» }) Это, кажется, только делают окно просто крон из немного. –

ответ

0

Сайт выглядит хорошо для меня. Я заметил очень мало, но это может быть мое воображение.

new Effect.Scale(more, 100, { 
     scaleX: false, 
     scaleY: true, 
     scaleContent: false, 
     scaleFrom: 1, 
     mode: 'absolute', 
     duration: 0.5 
    }); 
    $(more).show(); 

Возможно, вы захотите попробовать, хотя, похоже, это покажет, а затем обновите его, как говорится в коде. Сначала обновите его, а затем покажите.

Firefox, полностью обновленный кстати.

1

@Allen является правильным. Когда вы звоните $(more).show(); Отображается весь ящик. Затем, когда вы вызываете new Effect.Scale(more, ящик затухает и вдвигается. Таким образом, $(more).show(); - это то, что вызывает мерцание. Вы можете попробовать:

$(more).show.bind(more).delay(0.01); 
    new Effect.Scale(more, 100, { 
     scaleX: false, 
     scaleY: true, 
     scaleContent: false, 
     scaleFrom: 1, 
     mode: 'absolute', 
     duration: 0.5 
    }) 
Смежные вопросы