Как скрыть элементы HTML до их загрузки на страницу

У меня есть список SharePoint с настраиваемыми форматами «Создать» и «Изменить». Я использую jQuery, чтобы скрыть определенные поля на $(document).ready().Как скрыть элементы HTML до их загрузки на страницу

Что происходит при загрузке страницы, так это то, что перед тем, как они станут скрытыми, вы увидите все показанные поля (в течение секунды). Немного неприятно видеть этот вспышечный переход.

Есть ли способ манипулировать стилем элементов HTML до их загрузки? (Т.е .: дисплей: нет)

Пример кода:

$(document).ready() { 
    // Hides fields 1 and 3 on page load 
    // Users can see it being hidden in fraction of a second 
    $('#field-1').hide(); 
    $('#field-3').hide(); 
}

источник

2014-09-29 Marlo C

Вы в основном ответили на вопрос самостоятельно. просто скройте их с помощью простого css, используя 'display: none'. Может быть, добавить класс в тег 'body', который используется, чтобы скрыть всех детей и просто удалить этот класс, когда все загружено. – GNi33

Используйте CSS вместо JavaScript? – George

@ GNi33 Привет, проблема заключается в том, что SharePoint не помещает id или класс в эти поля . Я просто использовал поле-1 и поле-3 для их ссылки, но их не существует. Я не могу манипулировать их стилями, прежде чем они загрузятся. –

Лично я использовал бы простой CSS, чтобы скрыть элементы и сделать это, добавив класс в тег body.

<body class="initial-hide"> 
    ... 
</body>

CSS-будет выглядеть, как это тогда

body.initial-hide #element1, body.initial-hide #element2{ 
    display: none; 
}

Таким образом, все, что вам нужно сделать, чтобы показать скрытые элементы, чтобы удалить класс из тела - тег, чтобы показать элементы:

$(document).ready() { 
    $('body').removeClass('initial-hide'); 
}

вместо того, чтобы выбрать все элементы на своем собственном, чтобы вызвать .show() - функцию на них.

источник

2014-09-29 15:29:15 GNi33

Ahh, я использовал body {display: none; } и просто покажите его после загрузки всех полей. –

@MarloC в порядке, если вы хотите, чтобы вся страница была скрыта, а не только определенные элементы, это простой способ достичь этого. – GNi33

Я только хочу, чтобы определенные элементы были скрыты, но для них не видеть переход, я решил стилизовать тело как «скрытое». И покажите его, как только будут скрыты элементы jQuery. –

Это потому, что ваш JavaScript срабатывает только тогда, когда документ будет готов. Использование Css вместо JavaScript, чтобы скрыть элементы и загрузить его на странице

<style> 
#field-1,#field-3{ 
    display : none; 
} 
</style>

источник

2014-09-29 15:22:07 bipen

Я просто использовал поле-1 и поле-3 для ссылки, я прошу прощения за это. SharePoint на самом деле не помещает ни один идентификатор, ни класс в строки полей . Тем не менее, я понял это, используя body {display: none} и просто покажу его после завершения jQuery hiding/show. Благодаря! –

классный .. рад, что вы поняли это сами. Счастливое кодирование – bipen

Если установить стиль = «дисплей: нет;» на элементе, а затем с помощью jquery вы можете вызвать метод .show, чтобы они отображались.

источник

2014-09-29 15:22:14 Shriike

Я сделал это для тела {display: none} и использовал $ ('body'). Show() после того, как все сделано. Благодаря! –

Как скрыть элементы HTML до их загрузки на страницу

ответ

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