VPF::Данные появляющиеся после их загрузки.

dolci2006

Дата 15.6.2009, 16:37 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

Даные должгы появляться между 2х объектах (Шапкой и основанием сайта(footer)). и они должны появляться с запазданием, чтоб появлялся эфект анимации. т.е. чтоб не появлялась не вся страница а только те элементы которые заключены между шапкой и основанием.

Astraller

Дата 15.6.2009, 16:39 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 300
Регистрация: 1.8.2007
Где: $Украина[Кры м]->Феодосия

Репутация: 2
Всего: 5

А теперь еще раз, подробнее, и с примером кода smile

--------------------

A.S.T.R.A.L.L.E.R.: Artificial Synthetic Technician Responsible for Assassination, Logical Learning and Efficient Repair

ksnk

Дата 15.6.2009, 16:50 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386

dolci2006, поставить поверх данных, между хидером и футером непрозрачный "экран". по окончании загрузки страницы этот экран неторопливо делаем прозрачным и убираем совсем...

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

dolci2006

Дата 15.6.2009, 17:30 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

с непрозрачным экраном неполучится... вся задумка в том что "footer" заполняет все свободное пространство. и если туда засунить тексты то он съежает вниз. т.е должен получиться эфект анимации.

user posted image

dolci2006

Дата 15.6.2009, 19:56 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

Astraller

Дата 15.6.2009, 20:30 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 300
Регистрация: 1.8.2007
Где: $Украина[Кры м]->Феодосия

Репутация: 2
Всего: 5

Собственно, если я правильно понял что вы хотите, то, то что вы хотите вы не получите. smile

Если даже вставить контент в середину страницы JavaScript'ом с запозданием, например, в 1 сек, то средняя часть увеличится скачком. Никакого плавного эффекта не получится.

Даже если разбить содержимое по строкам и вставлять так, все равно будут скачки smile

Единственный вариант, это:
* содержимое поместить в скрытый (visibility:hidden) элемент
* определить его высоту
* плавно увеличить высоту блока куда будете вставлять контент
* вставить в этот блок контент

--------------------

A.S.T.R.A.L.L.E.R.: Artificial Synthetic Technician Responsible for Assassination, Logical Learning and Efficient Repair

dolci2006

Дата 15.6.2009, 21:27 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

спасибо.. только как это реализовать?

Добавлено через 4 минуты и 35 секунд
Я видел эфекты всплывающего горизонтального меню.. и всплывать оно начинает после функции клик или наведение. Можно использовать тотже код но, используя ф-цию загрузка данных. т.е проиходит все после того как сайт полность загрузиться(загрузка с сервера данных прекратиться и начинает появляться)

Astraller

Дата 15.6.2009, 21:33 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 300
Регистрация: 1.8.2007
Где: $Украина[Кры м]->Феодосия

Репутация: 2
Всего: 5

Цитата(dolci2006 @ 15.6.2009, 21:27

)

спасибо.. только как это реализовать?

Именно так как я написал.

А если вам нужен готовый, рабочий код, то вам не сюда, а на биржу труда. smile

Здесь дают подсказки, а там решения, но за деньги. smile

--------------------

A.S.T.R.A.L.L.E.R.: Artificial Synthetic Technician Responsible for Assassination, Logical Learning and Efficient Repair

dolci2006

Дата 15.6.2009, 21:38 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

мне самое главное узнать как можно отследить загружена ли страница или нет. после чего я буду использовать динамическое изменение высоты блока..

Astraller

Дата 15.6.2009, 21:55 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 300
Регистрация: 1.8.2007
Где: $Украина[Кры м]->Феодосия

Репутация: 2
Всего: 5

Цитата(dolci2006 @ 15.6.2009, 21:38

)

мне самое главное узнать как можно отследить загружена ли страница или нет

Есть событие window.onload.

--------------------

A.S.T.R.A.L.L.E.R.: Artificial Synthetic Technician Responsible for Assassination, Logical Learning and Efficient Repair

Aliance

Дата 16.6.2009, 08:36 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 55
Всего: 137

Используя библиотеку jQuery можно сделать так:

Код


...
<div id='main' style='visibility: hidden;'>
main content...
</div>
...

Код


$( function()
    {
        $( '#main' ).fadeIn( 'slow' );
    }
);

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

WIPS

Дата 16.6.2009, 10:13 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 199
Регистрация: 22.5.2006
Где: Украина, Киев

Репутация: 2
Всего: 8

Aliance, я так понимаю, что dolci2006 больше подойдет не fadeIn, a slideDown.

--------------------

Автопроизводители, машины, марки, модели!

dolci2006

Дата 16.6.2009, 11:04 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

Цитата(WIPS @ 16.6.2009, 10:13)

Aliance, я так понимаю, что dolci2006 больше подойдет не fadeIn, a slideDown.

да да. оно и есть.
вопрос довольно глупый.. как привизать выполнение этой операции к определеному <DIV>

WIPS

Дата 16.6.2009, 11:43 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 199
Регистрация: 22.5.2006
Где: Украина, Киев

Репутация: 2
Всего: 8

Цитата(dolci2006 @ 16.6.2009, 10:04

)

как привизать выполнение этой операции к определеному <DIV>

Курим ман по вышеприведенной ссылке, для выбора нужного дива читаем опять же тут.

Будет что-то типа:

Код


$('#your_div_id').slideDown("slow");

Ну и естественно саму библиотеку jQuery подключить надо.

Это сообщение отредактировал(а) WIPS - 16.6.2009, 11:44

--------------------

Автопроизводители, машины, марки, модели!

dolci2006

Дата 16.6.2009, 13:42 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

Да, спасибо все получилось... неработало т.к я забыл знак "#" поставить.. smile

стыдно блин((((

Итого получился такой код(Вдруг кому полезно будет.):

Закидываем этот код в тег <head></head>

Код


<script src="http://code.jquery.com/jquery-latest.js"></script>    -Подключаем библиотеку jQuery
  <script>
  $(document).ready(function(){
    
    $(document.body).click(function () {
      if ($('#main').is(":hidden")) {
        $('#main').slideDown("slow");     - Выбираем скорость развертывания("slow", "normal", "fast")
      } else {
        $('#main').hide();
      }
    });

  });
  </script>

Присваиваем "ID=main" к элементу страницы и присваиваем стиль этого элемента "display:none;"

Код


<div id="main" style="display:none;">
    бла бла бал бла бал<br>
    бла бла бал бла бал<br>
    бла бла бал бла бал<br><br>
</div>

Добавлено @ 13:47
window.onload. неполучается приписать эту функцию.
поидеи она должна идти гдето сдесь:
$(document.body).click(function (). кото знает подскажите

Это сообщение отредактировал(а) dolci2006 - 16.6.2009, 14:46

WIPS

Дата 16.6.2009, 14:23 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 199
Регистрация: 22.5.2006
Где: Украина, Киев

Репутация: 2
Всего: 8

Цитата(dolci2006 @ 16.6.2009, 12:42

)

Закидываем этот код в тег <title></title>

это код должен быть в <head>

Цитата(dolci2006 @ 16.6.2009, 12:42

)

window.onload. неполучается приписать эту функцию

попробуй так

Код


<body onload="your_function()"></body>

или так

Код


<body onclick="your_function()"></body>

хотя onclick на весь body это как-то жестко

--------------------

Автопроизводители, машины, марки, модели!

dolci2006

Дата 16.6.2009, 15:21 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

Подскажи как реализовать:
чтоб имено после того как страничка сайта полностью загрузиться начать выполнять эту операцию.

Код


 if ($('#main').is(":hidden")) {
        $('#main').slideDown("slow");
      } else {
        $('#main').hide();
      }

Это сообщение отредактировал(а) dolci2006 - 16.6.2009, 15:49

Aliance

Дата 16.6.2009, 16:08 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 55
Всего: 137

в head кидаешь следующий код:

Код


$( function()
    {
        if ($('#main').is(":hidden"))
        {
            $('#main').slideDown("slow");
        }
        else
        {
            $('#main').hide();
        }
    }
);

но непонятно зачем ты проверяешь не скрыт ли элемент, если он скрыт? ИМХО, достаточно просто строки:

Код


$( function()
    {
        $('#main').slideDown("slow");
    }
);

Добавлено через 2 минуты и 2 секунды
Кстати, при таком решении, пользователи, у который JS будет отключен, будут нервно курить в сторонке)

Это сообщение отредактировал(а) Aliance - 16.6.2009, 16:09

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

ksnk

Дата 16.6.2009, 16:21 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386

Aliance, Чтобы вредные юзеры, отключившие JS, курили со всеми в общей курилке, нужно "скрывать" #main тем-же JavaScript'ом.
К примеру, вставив в самое начало скрипта (в head) чего-то такое

Код


<script> document.write('<'+'style> #main { display:none} <'+'/style>') </script>

P.S. Исправил опечатки...

Это сообщение отредактировал(а) ksnk - 16.6.2009, 18:13

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

dolci2006

Дата 16.6.2009, 16:57 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

У меня получилось примерно так:

Код


<script>
  $(window.onload).ready(function(){     
        $('#slide').slideDown("slow"); 
  });
  </script>

Вопрос: проверяет ли window.onload загружены ли все картинки. и как сделать задержку а 1.5 секунды перед выполнением операции.

dolci2006

Дата 16.6.2009, 18:40 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

.setInterval попробывал эту функцию. наверно гдето ошибка т.к. неработает.

Код


<script>
      setTimeGou=window.setInterval("f1()", 1000);

    function f1()  
{
    $(document.body).click(function () {
      if ($('#main').is(":hidden")) {
        $('#main').slideDown("slow");
      } else {
        $('#main').hide();
      }
    
}
  
  </script>

ksnk

Дата 16.6.2009, 18:52 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386

Программирование методом научного тыка?

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

dolci2006

Дата 16.6.2009, 19:03 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 17
Регистрация: 15.6.2009

Репутация: нет
Всего: нет

Частично - ДА. JS я не знаю. все это я делаю по осходникам.. поэтому и пишу сдесь..

Aliance

Дата 17.6.2009, 09:27 (ссылка)

(нет голосов)

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 55
Всего: 137

ksnk, но тогда получится все равно что будет небольшая задержка перед скрытием элемента...

dolci2006, попробуй так:

Код


<script>
function onloadAndTimeoutFunction()
{
    $('#slide').slideDown("slow");
}
$( function()
    {
        setTimeout( 'onloadAndTimeoutFunction()', 1000  );
    }
);
</script>

--------------------

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »