slideDown () rende tutto in campagna involucro

Question

Al momento sto Creazione di un menu semplice in cui ci sono diversi nomi di servizi e un utente può fare clic su uno e jQuery mostreranno è corrispondente paragrafo che descrive al di sotto di esso. Il mio codice jQuery va bene e fa esattamente quello che voglio, però, ho un bug devo ancora appianare.

Ogni volta che si fa clic su una di queste voci ed è descrizione viene visualizzata, tutto nel wrapper per la pagina si sposta a sinistra circa 7 pixel in Firefox, si fa la stessa cosa è Google Chrome però non ho misurato l'amout ma sono assicurarsi che sia irrilevante.

In ogni modo, io sto usando il comando slideToggle () per mostrare la parragraph nascosto. Presumo che ciò si sta verificando perché quando si verifica l'slideDown è in qualche modo cambiando la larghezza del tutto e il "margin: 0 auto;" impostazione per la regola involucro nel mio css compensa per questo cambiamento. Qualcuno ha un modo per ovviare a questo problema? Ho provato diverse altre correzioni che ho trovato in giro per internet, ma senza alcun risultato.

Ecco quello che il mio aspetto codice come, ho messo su jsFiddle per rendere più facile per visualizzare: http: // jsfiddle.net/vcH7m/ Sentitevi liberi di modificarla se vi piace, o inviare ciò che deve essere risolto qui. Tutto ciò che è più conveniente. La ringrazio molto per l'aiuto!

Answer 1

Questo spostamento è probabilmente causato dalla barra di scorrimento verticale. Se la pagina diventa troppo grande, allora la barra di scorrimento verticale apparirà e spingere il punto di larghezza di un po 'più a sinistra. Si può vedere questo bene nel 1 ° comma, della data pagina jsfiddle Quando si riduce la finestra del browser a circa 1000x600.

Per risolvere questo problema, si può prendere in considerazione per posizionare una barra di scorrimento verticale fissa.

html {
    overflow-y: scroll;
}