Эффект угасающего желтого

2

dizelbox

8 октября 2009, 18:36

1009

В общем дело такое:

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

Так к примеру сделано vkontakte.ru на странице новостей.

<body onload="timer();">

<script language="JavaScript">

//это упрощенная функция изменения фона какого то элемента

function fnew(field,n)

{ 

if (n==2) {

var g='#F6F1D2';

document.getElementById('zd'+field).style.backgroundColor = g;

}

else {

var g='#dddddd';

document.getElementById('zd'+field).style.backgroundColor = g;

}

}

var n=2;

function timer() {

if (n==2) { fnew(45,1); n=1; } else  { fnew(45,2); n=2; } 

setTimeout( "timer()", 1000 );

}

</script>

При загрузке страницы включается функция таймер. Проблема состоит в том, что я не могу заставить работать фунцию fnew для вновь подгружаемых данных. То есть, если для уже сформированной страницы все работает, то для динамической, к примеру добавилась новость какая-то, у меня не получается применить эту функцию. Помогите решить проблемы.

А может у кого-то есть уже готовое решение.

Когда-нибудь это случится. Студия разработки и развития интернет-проектов StudioDizelBox (http://dizelbox.ru)

M

27

megafix

8 октября 2009, 18:43

#1

>я не могу заставить работать фунцию fnew для вновь подгружаемых данных

покажите функцию для подгрузки данных. Это же жс-функция, которая выполняет асинхронный(аякс) запрос на сервер, верно? Если, так, то думаю смогу помочь Вам:)

D

2

dizelbox

8 октября 2009, 20:22

#2

megafix:
>я не могу заставить работать фунцию fnew для вновь подгружаемых данных

покажите функцию для подгрузки данных. Это же жс-функция, которая выполняет асинхронный(аякс) запрос на сервер, верно? Если, так, то думаю смогу помочь Вам:)

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

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

Не работает мобильный интернет sql запрос на изменение Яндекс кобласит

[Удален]

8 октября 2009, 20:50

#3

этот эффект надо делать не проверяя загружен или не загружен, а сразу после загрузки.

воспользуйтесь фреймворками если ручками это сложно сделать

M

27

megafix

8 октября 2009, 21:24

#4

>Проблема в определении, подгружены те или иные данные с определенным id или нет.

Эта проблема решается как раз таки совместно с функцией подгрузки данных.

Вот пример на jquery:

$.ajax({

type: "POST",

url: "some.php",

data: "name=John&location=Boston",

success: function(msg){

// обновление блока....

// и тут же вызов функции подсветки....

}

});

вот тут поподробней: http://docs.jquery.com/Ajax/jQuery.ajax

Принцип тот же и для других жс-скриптов.

D

2

dizelbox

9 октября 2009, 12:35

#5

Видимо я совсем не догоняю.

Реализовать подсветку вновь добавленных данных можно двумя вариантами:

1) при загрузке запускается таймер, который проверяет, загрузились ли данные. Если да, то подсвечивает.

2) при загрузке самих данных, вместе с ними подгружаются и скрипты, которые и запускают процесс подсветки.

Как я не пробовал, первый вариант у меня не работает.

А на счет второго: то как мневыполнить функцию какую-либо, которая отправляется вместе с данными.

К примеру, самый простой вариант: вместе с подгружаемыми данными загружается скрипт


<script language="JavaScript">

alert(msg);

</script>

И чтобы сразу выполнялась функция alert(msg). Естественно, если мы просто загрузим этот участок кода, никакого сообщения не выскочит. Поэтому надо что-то предпринять. Я уже весь запутался, помогите.

M

27

megafix

9 октября 2009, 14:05

#6

dizelbox

Я вам уже привел пример на жквери. Если покажите свой код загрузки данных, то возможно покажу и на вашем примере.

Стукните в аську чтоли )

[Удален]

9 октября 2009, 14:19

#7

dizelbox:
при загрузке запускается таймер, который проверяет, загрузились ли данные. Если да, то подсвечивает.

При загрузке данных аяксом не нужен никакой таймер, там встроенными средствами легко отслеживается когда данные загрузились. Почитайте хоть на вики что ли про XMLHttpRequest

D

2

dizelbox

9 октября 2009, 14:28

#8

megafix:
dizelbox

Я вам уже привел пример на жквери. Если покажите свой код загрузки данных, то возможно покажу и на вашем примере.

Стукните в аську чтоли )

Я бы с радостью использовал Jqwery, но мне критичен объем передаваемой страницы. Поэтому все надо сделать без фреймворков.

[Удален]

9 октября 2009, 14:32

#9

dizelbox, jquery - 35 кб которые кешируются навсегда, работают во всех версиях всех браузеров. я бы использовал фреймворк а не самопись на больной коленке, которая потом еще и нарывать будет.

[Удален]

9 октября 2009, 21:01

#10

к тому ж можно jquery грузить с гугла =)

В 2023 году 36,9% всех DDoS-атак пришлось на сферу финансов

Что делать, если ваша email-рассылка попала в спам