2009-07-06 11 views
1

J'utilise l'accordéon JQuery. Tout va bien dans FireFox. Dans IE7, cependant, lorsque je clique sur un lien dans mon document qui développe l'un des en-têtes de menu en accordéon, mon contrôle de serveur en-tête est redimensionné (rétréci). Comment arrêter la taille de l'écran? Ceci est le morceau de JavaScript en question:Accordéon JQuery: Redimensionnement de mon contrôle d'en-tête

if (!$('h3.ReferenceBackgroundHeader', '#References').hasClass('ui-state-active')) { 

       $("#References").accordion('activate', 0); 

      } 

      window.scrollTo(0, $('#References').offset().top); 
      return false; 

Ce que je veux est le .accordion('activate',indexval); de ne pas modifier ma mise en forme d'en-tête.


Bizarre .. Il doit y avoir un travail pour cela dans IE. Si je vider ma fonction et juste courir:

window.scroll(0,900); 

Je perds toujours mon contrôle de séparation en haut ?! Quelqu'un a une suggestion?


Peut-être que c'est le problème .. La page est en fait composée de deux divs. La div supérieure est pour afficher le contrôle d'en-tête (avant les jours de MasterPages) et la section inférieure est la section que je tente de faire défiler à l'intérieur. Le div "content" est celui dont j'ai besoin pour pouvoir faire défiler. Le div "header" est celui qui disparaît quand je défile. Quelqu'un peut-il me sauver encore? :)

<body> 
<form id="Form1" method="post" runat="server"> 
    <div id="header"> 
     <uc1:Header ID="headerControl" runat="server"></uc1:Header> 
    </div> 
    <div id="content" style="overflow:auto"> 
     <asp:PlaceHolder ID="contentPlaceholder" runat="server"></asp:PlaceHolder> 
    </div> 
</form> 

Répondre

0

Alors je l'ai compris. Je travaille sur un code hérité que j'ai hérité. Je aboyais le mauvais arbre. J'ai trouvé le code suivant dans l'en-tête de la page me donnant du chagrin:

function resizeContentWindowScrollBar() { 
     var contentDiv = document.getElementById("content"); 
     var header = document.getElementById("header"); 

     if (header != null) { 
      var desiredHeight = document.body.clientHeight - header.clientHeight; 

      if (desiredHeight > 0) { 
       contentDiv.style.height = (document.body.clientHeight - header.clientHeight) + "px"; 

      } 
     } 


    } 

Notez les appels header.clientHeight? Cet extrait obtient évidemment la hauteur de l'en-tête et équivaut à la hauteur du contenu div. Le problème était (et seulement dans l'esprit d'IE) la fonction clientHeight renvoyait toujours "0". Je les ai remplacés par header.offsetHeight et tout va bien.

Il semblerait donc que dans IE mes fonctions clientHeight ne fonctionnent pas correctement.

+0

Bien, heureux que vous ayez compris le problème. Vous devriez sélectionner cette «réponse» comme étant la bonne, pour que les gens sachent que c'est résolu. – thebrokencube

2

Avez-vous une barre de défilement dans votre navigateur avant et après vous étendez le menu?

Ce qui pourrait arriver, c'est qu'avant de développer le menu, tout va à l'écran, donc le navigateur ne vous donne pas de barre de défilement; mais lorsque vous développez le menu, il a besoin de plus d'espace, de sorte que le navigateur ajoute une barre de défilement, ce qui entraîne une «mise à l'échelle» de la page Web.

Je ne sais pas comment résoudre ce problème sans définir un grand min-height dans votre fichier css afin que la barre de défilement s'affiche toujours.

Espérons que ça aide.

MISE À JOUR: Je viens de découvrir a website qui parle de la façon de résoudre la question de la barre de défilement. Je voulais juste laisser quelqu'un d'autre qui trouve cela une solution beaucoup plus propre.

+0

Je pense que vous avez raison .. Je vais expérimenter avec un peu plus, mais cela semble très probable. – Nick