1

実装する次のコードが与えられました。

<script type="text/javascript">

  $(document).ready(function(){
    $('.hotspots a').bind('mouseover click', function() {
      $this = $(this);
      if($('.hotspot-target').data('hotspot')!=$this.attr('href')) {
        $('.hotspot-target').data('hotspot', $this.attr('href'));

        $('.hotspot-target').fadeOut(100, function() {
          $('.hotspot-target').css({backgroundImage: 'url('+$this.attr('href')+')'});
          $('.hotspot-target .detail').hide();
          $('.hotspot-target .detail.'+$this.attr('class')).show();

          $('.hotspot-target').fadeIn(100);
        });
      }
      return false;
    })
  });
</script>

FF と Chrome では問題なく動作し、コンソールにエラーは表示されません。また、IE デバッガーでエラーを確認することもできませんが、そのしくみにはあまり慣れていません。

上記のコードに明らかな問題はありますか? ページの最後に掲載しています

4

1 に答える 1

0

どうですか:

$(document).ready(function(){
    $('.hotspots a').bind('mouseover click', function() {
        var hotSpotTarget = $('.hotspot-target'),
            value = this.href,
            cssClass = this.className;

        if(hotSpotTarget.data('hotspot') != value) {
            hotSpotTarget.data('hotspot', value);

            hotSpotTarget.fadeOut(100, function() {
                hotSpotTarget.css('background-image', 'url(' + value+ ')');
                hotSpotTarget.find('.detail').hide().filter('.' + cssClass).show();
                hotSpotTarget.fadeIn(100);
            });
        }
        return false;
    })
});

デモ: http://jsfiddle.net/2F9VW/1/

于 2012-09-12T11:13:24.437 に答える