2010-03-23 7 views
1

J'ai des problèmes avec le plugin Jquery qtip.Problème avec IE et JQuery Plugin qTip

Cela fonctionne très bien dans Firefox (voir ici http://movieo.no-ip.org/ survolez la première image).

Mais ne fonctionne pas dans IE. Voici le code:

$('.moviebox').each(function() { 
    $(this).qtip({ 
     content: $(this).children('.info'), 
     show: 'mouseover', 
     hide: 'mouseout', 

     style: { name: 'light' }, 
     position: { 
     corner: { 
      target: 'rightbottom', 
      tooltip: 'bottomleft' 
     } 
     } 
    }); 
}); 

Et le code html

<!--start moviebox--> 
    <div class="moviebox"> 
    <a href="#"> 
    <img src="http://1.bp.blogspot.com/_mySxtRcQIag/S6deHcoChaI/AAAAAAAAObc/Z1Xg3aB_wkU/s200/rising_sun.jpg" /> 
    </a> 
    <!--start infobox--> 
    <div class="info"> 
    <span>Rising Sun (2006)</span> 
    <div class="description"><strong>Description:</strong><br /> test test test test test test test test test test test test test test test test</div> 
    <img src="http://1.bp.blogspot.com/_mySxtRcQIag/S6deHcoChaI/AAAAAAAAObc/Z1Xg3aB_wkU/s200/rising_sun.jpg" /> 
<div class="cast"><strong>Cast:</strong><br /> Sean connery</div> 
    <div class="rating"><strong>Rating:</strong><br />5stars</div> 
    </div> 
    <!--end infobox--> 
    </div> 
    <!--end moviebox--> 

Pourquoi pas que le travail dans IE ????? Me bat. Commander movieo.no-ip.org pour toute la source

Répondre

3

Essayez d'utiliser les éléments suivants:

$('.moviebox').each(function() { 
    $(this).qtip({ 
     content: $(this).find('.info'), 
     show: 'mouseover', 
     hide: 'mouseout', 

     style: { name: 'light' }, 
     position: { 
     corner: { 
      target: 'rightbottom', 
      tooltip: 'bottomleft' 
     } 
     } 
    }); 
}); 

Dans IE n'est pas un .info descendant direct de .moviebox.

+1

Merci beaucoup! Ça marche. Puis-je demander pourquoi dans IE ce n'est pas un descendant ?? – user272899

+1

A deviner c'est quelque chose à voir avec votre plugin aux coins arrondis. Il semble que votre contenu soit enveloppé de divs supplémentaires. – Sam

0

Vous pouvez ajouter

<meta http-equiv="X-UA-Compatible" content="IE=Edge"> 

pour IE et cela fonctionnera.