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


Пользователь месяца
Ixman Ixman 1-й за Октябрь
Очков активности: 693 0 тем, 33 сообщения, 14 баллов репутации
Сайт: o5cat.ru
ТОП самых активных за этот месяц
  • Фотография ShowPrint
    #1

    ShowPrint (ShowPrint.ru)
    Очков активности: 96 Вне конкурса за определение пользователя месяца

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

    yuran (yurbol.ru)
    Очков активности: 82.5 0 тем, 55 сообщений, 1 балл репутации

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

    Ixman (o5cat.ru)
    Очков активности: 72 Вне конкурса за определение пользователя месяца

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

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

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

    Mandarin
    Очков активности: 42 0 тем, 28 сообщений, 1 балл репутации

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

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

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

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

  • Фотография алексс
    #8

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

  • Фотография Scool
    #9

    Scool (stostory.ru)
    Очков активности: 18 3 темы, 3 сообщения, 1 балл репутации

  • Фотография Mariko
    #10

    Mariko
    Очков активности: 16.5 1 тема, 8 сообщений, 1 балл репутации

  • Показать весь ТОП 10
Поддержите форум! =)
Апдейты
  • Яндекс ИКС: 31.10.2018
  • Яндекс выдача: 15.11.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
  • Администратор
  • 4762 сообщений
  • Репутация: 712

Отправлено 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