jQuery - лучший способ скрыть элемент?(чтобы предотвратить мигание элемента перед тем, как его скрыть) - PullRequest
Новая
       15

jQuery - лучший способ скрыть элемент?(чтобы предотвратить мигание элемента перед тем, как его скрыть)

8 голосов
/ 22 августа 2011

Я помню, что в какой-то момент в Opera ( Mostlikely it was Safari instead. ) возникла проблема, заключающаяся в том, что, если вы использовали .hide() для элемента, он ненадолго вспыхнул, прежде чем фактически скрыл элемент.

Теперь, если вы не хотитене обращайте внимания на тех, у кого по какой-то причине нет js в их браузере, вы не можете использовать CSS, чтобы установить display: none; в этом элементе, чтобы скрыть его, а затем использовать js, например, чтобы добавить его.

Я недавно заметил, чтов Опере такого больше не было.Итак, я хотел бы знать, если это все еще происходит в некоторых браузерах, если я пропустил это ... И предположить, что это произойдет.Какой способ был бы самым безопасным для этого?(конечно, игнорируя метод css в этом случае.)

js .hide()

js .addClass('hide') css .hide { display: none; }

Или что-то еще?

Редактировать:

js element.style.display = "none"

js $(element).css({display:"none"})

Edit2: Эта проблема, возможно, действительно была в Safari.Я также подумал, что более новые версии jquery могли бы решить эту проблему. Поскольку я думаю, что на веб-сайте jquery было несколько сообщений об этой проблеме, но я не мог найти эти сообщения об ошибках. Или, возможно, более новая версия браузера исправила это... Не уверен.

Edit3:

Итак, я действительно нашел гораздо больше об этом, когда начал искать эту ошибку в Safari, а не в Opera.Хотя я не могу с уверенностью сказать, что это никогда не происходило и в опере ...

Казалось бы, этой проблемы больше не существует и что безопасно использовать .hide(), но я узнал, что это$(element).css({display:"none"}) исправил проблему, когда проблема все еще существовала.

Ответы [ 3 ]

5 голосов
/ 22 августа 2011

Вы всегда должны полагаться на использование метода jQuery hide(), чтобы скрыть любой элемент, потому что он заботится обо всех браузерах. Я не видел никаких проблем в Opera, хотя.

Даже чтобы показать какой-либо элемент, вы всегда должны полагаться на использование метода show() по той же причине.

например. Чтобы показать элемент tr, если мы скажем tr.css("display", "block"), он не будет работать в Firefox, потому что это строка таблицы, и его нужно указать как .css("display", "table-row"). Но если вы используете tr.show(), вам не нужно беспокоиться о любом браузере.

1 голос
/ 15 ноября 2011

Просто добавьте отображение: нет в таблице стилей или вставьте встроенный стиль = "display: none" в элемент.

0 голосов
/ 22 августа 2011

Вы можете использовать noscript для предоставления альтернативного элемента, который всегда отображается, в то время как элемент JS начинается скрытым.

Или вы можете использовать start out с классом без правил CSS, а затем получить скрипт для изменения правила класса CSS, чтобы убедиться, что элемент начинается скрытно. 

<html>
    <head>
        <style type="text/css">
            p.start-hidden-if-js-enabled {              
            }
        </style>
        <script type="text/javascript">
            document.styleSheets[0].cssRules[0].style.display = "none";
        </script>
    </head>
    <body>
        <p class="start-hidden-if-js-enabled">
            This text will be hidden if javascript is enabled.
        </p>
    </body>
</html>
...