Differences

This shows you the differences between two versions of the page.

--- joomla:task13 [2009/02/03 01:10] – kibi
+++ joomla:task13 [2010/04/02 15:45] (current) – kibi
@@ Line 1: / Line 1: @@
+====== Скрытие модуля RokSlide во время загрузки страницы ======
+{{tag>joomla rokslide css javascript}}
+===== Задача =====
+При загрузке страницы содержимое модуля RokSlide сначала отрисовывается в "разваленном" виде и лишь после подгрузки всех изображений складывается в свой окончательный вид. Необходимо скрыть этот этап от пользователя, дабы не портить впечатление от сайта.
+===== Решение =====
+Надо через CSS скрыть весь модуль и при его инициализации в JavaScript'e показать пользователю. Управление CSS стилями через JavaScript работает очень по разному не только в разных браузерах, но и в разных контекстах, так что лучше с помощью JavaScript переключать класс элемента, а стиль указывать в CSS.
+Добавляем в **templates/rt_replicant/css/rokslidestrip.css** новый класс:
+<code css>
+.notvisible {display:none;}
+</code>
+Добавляем ссылку на класс в файл шаблона **templates/rt_replicant/index.php**:
+<code html>
+<div id="showcase" class="notvisible">
+  <?php mosLoadModules('advert1', -1); ?>
+</div>
+</code>
+Добавляем в **modules/rokslide/rokslidestrip.js** в функцию инициализации кусок, убирающий ссылку на класс:<code javascript>
+initialize: function(contents, options) {
+  // новая строка
+  document.getElementById('showcase').className="";
+</code>