jQuery Как скрыть DIVs, они отображаются для разделения во второй раз на странице Загрузить

Я сделал очень быстрое слайд-шоу jquery, и я использую это, чтобы скрыть DIV, которые не должны отображаться до тех пор, пока не станет их очередь:jQuery Как скрыть DIVs, они отображаются для разделения во второй раз на странице Загрузить

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

Но при загрузке страницы вы можете увидеть gall2 gall3 и gall4 Див за доли секунды, прежде чем они будут скрыты.

было бы ОК, чтобы просто добавить в моем CSS:

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

Это позволит решить проблему их, показывая на долю секунды, просто хочу знать, если это приемлемо

Спасибо.

источник

2009-12-06 Thomas Carter

~~Да, это, безусловно, приемлемо, чтобы сделать это в вашем CSS~~

Остальные респонденты правильно. Не очень хорошая практика делать вещи видимыми только с JS. Думаю, я просто думал о техническом: изменение CSS таким образом позволило бы решить проблему.

источник

2009-12-06 17:44:27 EMiller

Я понимаю, что меньше людей отключили JS, но если функциональность будет * включена * с JS, то контент также должен быть * скрыт *, используя что-то, вызванное JS. Это прекрасно, если JS просто добавляет класс, но скрытие по умолчанию в CSS - это не очень хорошая идея. –

Всегда старайтесь представить, какие пользователи, у которых отключен JS, будут видеть. Если вы используете решение CSS, для них не будут отображаться не первые DIV, но если вы программно измените слайды, они, очевидно, будут видеть только первый. Лучше дать им вариант «Нет JS». Затем, если вы можете быть уверены, что пользователь имеет JS, вы можете скрыть divs с помощью CSS и показать их с помощью JS.

источник

2009-12-06 17:45:48 AttishOculus

Отключение в CSS в порядке, но пользователи без JS никогда их не видят.

Чтобы отключить для пользователей с JS только, отметьте тело и соответствующий CSS:

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

CSS:

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

источник

2009-12-06 17:50:56 orip

@orip. Я делаю что-то подобное, но делаю это в голове и использую 'document.documentElement.className + =" js ", чтобы применить его к элементу' html'. Я помещал это в блок сценария перед всеми моими другими скриптами. –

Это очень умно – Gregory

@Gregory - это не моя идея, я видел эту технику, используемую другими. Я также думал, что это было очень умно :) – orip

Как alternatie в ответ orip, вы можете сделать следующее, если вы не «т как добавление скриптов в <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>

Вы избежите мерцающий т его путь, потому что вы добавляете имя класса в HTML до DOM готовы.

источник

2009-12-06 18:32:21 David

Очевидно, что этот пример не будет работать, если вы не поместите тег сценария jQuery перед другим тегом. Я бы порекомендовал просто использовать 'document.documentElement.className + = 'js'', чтобы избежать зависимости jQuery в начале игры. –

@ dcneiner: просто укажите пример здесь. Конечно, вам нужно включить библиотеку jQuery перед использованием jQuery. Ваш пример тоже работает. – David

Они показываются, потому что по умолчанию деления, вероятно, будут отображаться. Поскольку для запуска «готового» события на странице может потребоваться несколько секунд, вызовы метода .hide() не пострадают, пока все на странице не будет загружено и не будет готово.

Если я правильно помню, метод .hide() просто установит атрибут «display» элемента «none». Таким образом, по умолчанию установка div, которая должна быть скрыта с помощью CSS, позволяет им всегда скрываться, и вы получаете дополнительный бонус пользователей, даже если JS не видит их.

источник

2009-12-06 19:58:35 MadcapLaugher

jQuery Как скрыть DIVs, они отображаются для разделения во второй раз на странице Загрузить

ответ

Смежные вопросы