jQuery Come nascondere i DIV, vengono visualizzati per una seconda divisione a pagina Carica

Ho creato uno slideshow jQuery molto veloce, e lo sto usando per nascondere i DIV che non dovrebbero essere mostrati finché non è il loro turno, ovviamente:jQuery Come nascondere i DIV, vengono visualizzati per una seconda divisione a pagina Carica

$(document).ready(function() { 
    //Hide All Div's Apart From First 
    $('div#gall2').hide(); 
    $('div#gall3').hide(); 
    $('div#gall4').hide();

Ma il caricamento della pagina è possibile vedere gall3 gall2 del DIV e gall4 per una frazione di secondo prima che vengano nascosti.

sarebbe OK per aggiungere solo dentro la mia CSS:

#gall2, #gall3, #gall4{ display:none;}

questo risolverebbe il problema di loro mostrando per una frazione di secondo, vogliono solo sapere se è accettabile

Grazie.

fonte

2009-12-06 Thomas Carter

~~Sì, è certamente accettabile per farlo nel CSS~~

Gli altri partecipanti sono corrette. Non è una buona pratica rendere le cose visibili solo con JS. Credo che stavo pensando solo tecnicamente: cambiare il tuo CSS in questo modo avrebbe risolto il problema.

fonte

2009-12-06 17:44:27 EMiller

Mi rendo conto che meno persone hanno disabilitato JS, ma se la funzionalità sarà * abilitata * con JS, allora il contenuto dovrebbe anche essere * nascosto * usando qualcosa attivato da JS. Va bene se il JS aggiunge semplicemente una classe, ma nascondersi per impostazione predefinita in CSS non è una buona idea. –

Cerca sempre di immaginare cosa vedranno gli utenti che hanno disattivato JS. Se si utilizza la soluzione CSS, anche i DIV non primi non verranno visualizzati per essi, ma se si modificano le diapositive a livello di codice, verrà visualizzato solo il primo, ovviamente. È meglio dare loro un'opzione "No JS". Quindi, se puoi essere sicuro che l'utente abbia abilitato JS, puoi nascondere i div usando i CSS e mostrarli usando JS.

fonte

2009-12-06 17:45:48 AttishOculus

La disabilitazione in CSS va bene, ma gli utenti senza JS non li vedranno mai.

Per disabilitare per gli utenti con JS solo, segnano il corpo e appropriato CSS:

<body> 
    <script type="text/javascript"> 
    document.body.className += " js"; 
    </script>

CSS:

.js #gall2, .js #gall3, .js #gall4 { display: none; }

fonte

2009-12-06 17:50:56 orip

@orip. Faccio qualcosa di simile, ma lo faccio in testa, e uso 'document.documentElement.className + =" js "' per applicarlo all'elemento 'html'. L'ho messo in un blocco di script prima di tutti i miei altri script. –

Questo è molto intelligente – Gregory

@ Gregory - non è una mia idea, ho visto questa tecnica usata da altri. Ho anche pensato che fosse molto intelligente :) – orip

Come alternatie alla risposta di orip, è possibile effettuare le seguenti operazioni se si don 't come l'aggiunta di script nella <body>:

<html> 
<head> 
    <script src="jquery.js"></script> 
    <script> 
    $('html').addClass('js'); 
    $(function() { 
     // do DOM ready stuff 
    }); 
    </script> 
    <style> 
    .js #gall2, .js #gall3, .js #gall4 { display: none; } 
    </style> 
</head>

eviterete sfarfallio t a modo suo perché stai aggiungendo un nome di classe all'HTML prima del DOM.

fonte

2009-12-06 18:32:21 David

Ovviamente questo esempio non funzionerà a meno che non si inserisca il tag script jQuery prima dell'altro tag. Raccomanderei semplicemente di utilizzare 'document.documentElement.className + = 'js'' per evitare la dipendenza da jQuery all'inizio del gioco. –

@dcneiner: basta solo dare un esempio qui. Ovviamente è necessario includere la libreria jQuery prima di utilizzare jQuery. Anche il tuo esempio funziona. – David

Vengono visualizzati perché, in base alle impostazioni predefinite, è probabile che le div vengano visualizzate. Poiché possono trascorrere alcuni secondi prima che l'evento "pronto" venga attivato sulla pagina, le chiamate al metodo .hide() non verranno eseguite fino a quando tutto nella pagina non sarà caricato e pronto.

Se ricordo bene, il metodo .hide() imposterà l'attributo "display" dell'elemento su "none". Quindi, per impostazione predefinita, il div da nascondere tramite CSS consente loro di essere sempre nascosti e si ottiene il bonus aggiuntivo degli utenti senza che JS non li veda.

fonte

2009-12-06 19:58:35 MadcapLaugher

jQuery Come nascondere i DIV, vengono visualizzati per una seconda divisione a pagina Carica

risposta

Problemi correlati