Перейти к содержимому


Пользователь месяца
TimurR TimurR 1-й за Август
Очков активности: 726 3 темы, 35 сообщений, 11 баллов репутации
ТОП самых активных за этот месяц
  • Фотография ShowPrint
    #1

    ShowPrint (ShowPrint.ru)
    Очков активности: 207 2 темы, 17 сообщений, 6 баллов репутации

  • Фотография Ixman
    #2

    Ixman (o5cat.ru)
    Очков активности: 105 0 тем, 10 сообщений, 7 баллов репутации

  • Фотография WGN
    #3

    WGN (worldgamenews.com)
    Очков активности: 90 Вне конкурса за определение пользователя месяца

  • Фотография magnet
    #4

    magnet (rbfxdirect.com)
    Очков активности: 67.5 Вне конкурса за определение пользователя месяца

  • Фотография BLIK
    #5

    BLIK
    Очков активности: 45 Вне конкурса за определение пользователя месяца

  • Фотография TimurR
    #6

    TimurR
    Очков активности: 42 Вне конкурса за определение пользователя месяца

  • Фотография AnnaYa
    #7

    AnnaYa (topbase.ru)
    Очков активности: 33 2 темы, 5 сообщений, 2 балла репутации

  • Фотография Developer
    #8

    Developer
    Очков активности: 33 2 темы, 16 сообщений, 1 балл репутации

  • Фотография Алексей111
    #9

    Алексей111
    Очков активности: 28.5 5 тем, 4 сообщения, 1 балл репутации

  • Фотография Игорь Ку
    #10

    Игорь Ку (dudesday.ru)
    Очков активности: 24 1 тема, 5 сообщений, 2 балла репутации

  • Показать весь ТОП 10

Kwork.ru - услуги фрилансеров от 500 руб.

Поддержите форум! =)
Апдейты
  • Яндекс тИЦ: 19.11.2017
  • Яндекс выдача: 24.09.2018
Топ 5 участников по репутации


Непростое слайдшоу

#1 xalz

xalz
  • Неактивные
  • 29 сообщений
  • Репутация: 4
0

Отправлено 14 September 2012 - 09:26

Суть проблемы такова. Делаю интернет магазин. Весь товар с картинками, описанием и превюшками будут на одной странице (пример edasamuraev.ru). И в шапке сайта необходимо организовать сладшоу ВСЕГО товара (не 3-5 картинок, а все). Естественно если загружать все картинки сразу, то это будет огромная нагрузка и на интернет канал и на браузер (последний может вообще потухнуть).
Так вот может кто подскажет как подкрутить ?

В принципе ссылки на полную версию изображения я выдергиваю с помощью jq, а дальше ступор.
$('a[rel]').each(function(i, item) {
var src = $(item).attr('href');
var img = $("<img />", {src: src, height: '250'});
$('#slideshow').html(img);
});
тут получается что все изображения меняются без задержек ( html(img) ).

Подскажите может я вообще не в ту сторону копаю?

 

 

  • 0

#2 xalz

xalz
    Topic Starter
  • Неактивные
  • 29 сообщений
  • Репутация: 4

Отправлено 14 September 2012 - 12:54

проблема решена...
  • 0

#3 Sosnovskij

Sosnovskij
  • Администратор
  • 4686 сообщений
  • Репутация: 706

Отправлено 18 September 2012 - 21:11

xalz, в чем была проблема? Возможно, у других пользователей будут похожие проблемы :rolleyes:
  • 0

:excl: Требуется ЛинкБилдер (создание ссылочной массы, 1200-1600 руб в сутки). Блог — https://sosnovskij.ru/.



#4 xalz

xalz
    Topic Starter
  • Неактивные
  • 29 сообщений
  • Репутация: 4

Отправлено 29 September 2012 - 09:23

Sosnovskij, в общем я разрабатывал официальный сайт Свадебного салона (счастье-нк.рф).
Как видно на сайте, весь товар находится на одной странице, навигация по категориям осуществляется с помощью веб-якорей. Также фотки на товар грузятся с помощью плагина jquery.lazyload.js, чтобы экономить время и трафик.
У меня оставалась только одна проблема - это поиск плагина слайдшоу, но опять же чтобы в этом слайдшоу картинки грузились не все сразу, а по очереди с интервалом 5-6 секунд. Поискав в сети и перепробовав разные плагины, так и не чего не нашол! Пришлось придумывать костыль, сильно "выделыватся" я не стал, так как время уже поджимало и надо было быстро что-то наклепать.
Выношу на суд, да может что-то и неправильно и не по "Стандарту", но все же все работает и стабильно.

Клиентская часть:
$.slideshow = function() {
var slideshow = $("<div />", {id: "slideshow"});
var a = $("<a />");
var img = $("<img />", {height: '300', width: '600'}).css('display', 'none');
$('#top').each(function() {$(this).prepend(slideshow.clone());});
$('#slideshow').each(function() {$(this).prepend(a.clone())});
$('#slideshow a').each(function() {$(this).prepend(img.clone())});
$.ajax({
type: "POST",
url: "./",
data: {action: 'slideshow'},
dataType: "script",
});}

Тут мы создаем <div> и в нем же создаем пустой тег <a> и <img>. после делаем AJAX запрос к серверу, который выдергивает из MySQL имена картинок, а затем формирует javascript (Здесь конечно же неправильно, но а что поделаешь :D ).

Серверная часть:

<?php
$query = "SELECT * FROM `catalog`";
$result = mysql_query($query);
while ($row = mysql_fetch_array($result))
{
$c_id[]=$row["id"];
$c_name[]=$row["name"];
$c_img[]=$row["img"];
}
$id=count($c_id);
for ($ip=0; $ip<$id; $ip++)
{
if (!$ip) {
$timeout = 0;
} else {
$timeout = 5000 + $timeout;
}?>
setTimeout(function(){
$('#slideshow a')
.attr('href', '<?=http();?>/product/<?=$c_id[$ip];?>')
.attr('title', '<?=$c_name[$ip];?>')
$('#slideshow img')
.css('display', 'none')
.attr('src', '<?=http();?>/plugins/uploader/files/<?=$c_img[$ip];?>')
.fadeIn('1000');
}, <?=$timeout;?>);
<?}?>
setTimeout(function(){
$.ajax({
type: "POST",
url: "./",
data: {action: 'slideshow'},
dataType: "script",
});
}, <?=$timeout+5000;?>);
<?}?>
После того как все картинки кончились, скрипт опять делает AJAX запрос и все идет по новой.
Да, кто то скажет что нужно это дело кешировать, использовать JSON итд, в общем судить вам.
  • 1


Оформление форума – IPBSkins.ru