0

これは説明するのが少し奇妙ですが、jQuery を使用して、テーブル (私には恥ずべきことです) と画像を使用して、小さなインタラクティブな家のようなものを作成しようとしています。4 つのテーブル セルがあり、クリックすると 4 つすべてのスペースを占めるようにサイズが変更されます (より良いアイデアについては、リンクの画像を参照してください)。ただし、IE では、下部のセルのサイズが変更されますが、それらの上に奇妙なギャップが作成されます (を参照)。添付画像の右側のスクリーンショット)。(左側の階段をクリックして) セルを通常のサイズに戻すと、正常に表示されます。

スクリーンショット: http://www.dumpt.com/img/viewer.php?file=2d1v0ktgb4m1a6c1lg6h.png

サイズ変更を行うコードは次のとおりです。

$('td').click(function(){
  var thisID = $(this).attr('id');
  var thisIMG = '<img src="' + thisID + '.jpg" usemap="#' + thisID + '-map">';
  $(this).animate({'height':'240px','width':'280px'},500);
  $('td').not(this).animate({'height':'0px','width':'0px'},500);
  $(this).html(thisIMG);
});
$('#tableStairs').click(function(){
  $('td').animate({'height':'120px','width':'140px'},500);
  $('td').html('');
});

誰でもアイデアはありますか？

ありがとう、

灰

4

0 に答える 0