Эффект наведения пальца не работает в IE - PullRequest
0 голосов
/ 27 февраля 2012

Я пытаюсь создать эффект наведения эскиза.Он работает в любом браузере, но IE ... Где я ошибся?!?

JQuery:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery-ui.min.js"></script>
<script type="text/javascript" src="thumbhover.js"></script>
<script>

$('.sliders li:gt(3)').css('display', 'none');

$(".more").click(function() {
    $('.sliders li:first').insertAfter('.sliders li:last').toggle('clip', 100, function() {
        $('.sliders li:eq(3)').toggle('scale', 100);
    });

});

$(document).ready(function() {
    $('#thumb img').hoverpulse({
        size: 50,  // number of pixels to pulse element (in each direction)
        speed: 400 // speed of the animation 
    });
});
</script>​

HTML:

<div class="clients">
    <ul class="sliders" style="font-size: 11px; list-style: none;">
      <li class="slider">
        <div class="left" style="width: 87px;" id="thumb"><img src=
        "images/whit-images/12.jpg" width="80" height="60" alt="fishing cancun" /></div>

        <div class="left" style="height: 60px; width: 200px; margin-left: 87px;">
          <strong><br />
          15 min. fight 15 lbs Jack Crevalle</strong><br />
          February 22 2012
        </div><br clear="all" />
      </li>

      <li class="slider">
        <div class="left" style="width: 87px;" id="thumb"><img src=
        "images/whit-images/11.jpg" width="80" height="60" alt="fishing cancun" /></div>

        <div class="left" style="height: 60px; width: 190px; margin-left: 87px;">
          <strong>Ben Kirkpatrick with a Baby Tarpon</strong><br />
          February 21 2012
        </div><br clear="all" />
      </li>

      <li class="slider">
        <div class="left" style="width: 87px;" id="thumb"><img src=
        "images/whit-images/10.jpg" width="80" height="60" alt="fishing cancun" /></div>

        <div style="height: 60px; width: 200px; margin-left: 87px;">
          <strong>Ben with a nice size lookdown</strong><br />
          February 21 2012
        </div><br clear="all" />
      </li>

      <li class="slider">
        <div class="left" style="width: 87px;" id="thumb"><img src=
        "images/whit-images/9.jpg" width="80" height="60" alt="fishing cancun" /></div>

        <div class="left" style="height: 60px; width: 200px; margin-left: 87px;">
          <strong>Cancun</strong><br />
          February 2012
        </div><br clear="all" />
      </li>

      <li class="slider">
        <div class="left" style="width: 87px;" id="thumb"><img src=
        "images/whit-images/8.jpg" width="80" height="60" alt="fishing cancun" /></div>

        <div class="left" style="height: 60px; width: 200px; margin-left: 87px;">
          <strong><br />
          Chris Webber</strong><br />
          February 2012
        </div><br clear="all" />
      </li>

      <li class="slider">
        <div class="left" style="width: 87px;" id="thumb"><img src=
        "images/whit-images/7.jpg" width="80" height="60" alt="fishing cancun" /></div>

        <div class="left" style="height: 60px; width: 200px; margin-left: 87px;">
          <strong><br />
          Dwayne Perillo, first bonefish of 2012</strong><br />
          February 18 2012
        </div><br clear="all" />
      </li>

      <li class="slider">
        <div class="left" style="width: 87px;" id="thumb"><img src=
        "images/whit-images/6.jpg" width="80" height="60" alt="fishing cancun" /></div>

        <div class="left" style="height: 60px; width: 200px; margin-left: 87px;">
          <strong><br />
          Sweet catch</strong><br />
        </div>
      </li>
    </ul>
  </div>

CSS:

.slider{
    position: relative;
    height: 65px;
    margin-bottom: 4px;
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}   

.clients{
    width: 330px;
    margin: 0 auto;
    position: relative;
    height: 320px;
}

Вот фактический веб-сайт , пожалуйста, не комментируйте, насколько грязный код.Я не должен трогать это!(в нижней половине, где находится клиентская часть).

1 Ответ

0 голосов
/ 27 февраля 2012

Только что посмотрел в IE9, и он вынужден выполнять рендеринг в режиме Quirks . Действительно, прежде чем пытаться понять, почему IE не работает правильно, если возможно, потратьте время на исправление движка рендеринга (чтобы он работал в стандартном режиме). Есть большая вероятность, что все исправится.

...