Создать ответ 
Модификация скрипта плавной смены изображений на jQuery
Автор Сообщение
Swisss Не на форуме
Рядовой
*

Сообщений: 6
У нас с: Sep 2014
Сообщение: #31
RE: Модификация скрипта плавной смены изображений на jQuery
Теперь всплыл такой нюанс - видимо из-за того что в 1 и 2 блоке у меня по 3 изображения, а в 3 блоке всего 2, то в 3 блоке последнее изображение выводится на экран 2 раза подряд. Как можно поправить?

Спасибо.

Может разделить саму функцию? Сначала 1 и 2 блок, а потом отдельно 3 блок?
(Последний раз сообщение было отредактировано 16.09.2014 в 22:09:43, отредактировал пользователь Swisss.)
16.09.2014 22:05:45
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,279
У нас с: Aug 2011
Сообщение: #32
RE: Модификация скрипта плавной смены изображений на jQuery
Вот, вроде что-то получилось, только уже поздно и спать хочется. Tired

Код:
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script type="text/javascript">
var imgs = [['image/img_1.png','image/img_2.png','image/img_3.png','image/img_4.png'],
            ['image/img_2.png','image/img_3.png','image/img_4.png'],
            ['image/img_3.png','image/img_4.png']];
var links = [['news.php','script.php','useful_site.php','trick.php'],
            ['script.php','useful_site.php','trick.php'],
            ['useful_site.php','trick.php']];

var text = [[],
            ['Произвольный текст','Другой текст','Просто текст'],
            ['Другой текст','Просто текст']];

var n=[0,0,0];
time=800;
play=setInterval("chgImg(1)", 2500);
play2=setInterval("chgImg(2)", 3500);
play3=setInterval("chgImg(3)", 4000);

function chgImg(num) {
var nn=num-1;
n[nn] += 1;
if (n[nn] > imgs[nn].length-1) n[nn] = 0;
$('#slide_show_'+num+', #slide_show_text_'+num+', #slide_show_links_'+num).fadeOut(time, function() {
$('#slide_show_links_'+num).attr('href', links[nn][n[nn]]);
$('#slide_show_text_'+num).html(text[nn][n[nn]]);
$('#slide_show_'+num).attr('src', imgs[nn][n[nn]]);
$('#slide_show_'+num+', #slide_show_text_'+num+', #slide_show_links_'+num).fadeIn(time);
});
}
</script>

<a href="news.php" id="slide_show_links_1"><img src="image/img_1.png" alt="" id="slide_show_1"></a>
<br><br>

<a href="script.php" id="slide_show_links_2"><img src="image/img_2.png" alt="" id="slide_show_2"></a>
<div id="slide_show_text_2">Произвольный текст</div>
<br><br>

<div id="slide_show_text_3">Другой текст</div>
<a href="useful_site.php" id="slide_show_links_3"><img src="image/img_3.png" alt="" id="slide_show_3"></a>
<br><br>

Теперь можно для каждого слайдшоу указывать свой интервал для смены изображений.
16.09.2014 23:39:13
Найти все сообщения Цитировать это сообщение
Swisss Не на форуме
Рядовой
*

Сообщений: 6
У нас с: Sep 2014
Сообщение: #33
RE: Модификация скрипта плавной смены изображений на jQuery
Спасибо за помощь! Все никак не могу добраться и проверить. На днях думаю отпишусь, но думаю что все работает =)
02.02.2015 01:09:01
Найти все сообщения Цитировать это сообщение
PTslawa681 Не на форуме
Рядовой
*

Сообщений: 2
У нас с: Apr 2015
Сообщение: #34
RE: Модификация скрипта плавной смены изображений на jQuery
Имеется три скрипта информера погоды. Возможно ли их поочерёдно загружать через ваш скрипт, и если возможно, то что нужно изменить в скрипте?

Код:
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="160" HEIGHT="113"
id="loader" ALIGN=""> <PARAM NAME=movie VALUE="http://rp5.ru/informer/group/1/29.swf">
<PARAM NAME=quality VALUE=high> <PARAM NAME=scale VALUE=noscale>
<PARAM NAME=salign VALUE=LT> <PARAM NAME=wmode VALUE=transparent>
<PARAM NAME=bgcolor VALUE=#FFFFFF> <PARAM NAME=flashvars VALUE="points=141690,8218&lang=ru&um=00000">
<EMBED src="http://rp5.ru/informer/group/1/29.swf" quality=high scale=noscale salign=LT wmode=transparent
bgcolor=#FFFFFF  WIDTH="160" HEIGHT="113" NAME="loader" flashvars="points=141690,8218&lang=ru&um=00000" ALIGN=""
TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
WIDTH="160" HEIGHT="113" id="loader" ALIGN=""> <PARAM NAME=movie VALUE="http://rp5.ru/informer/group/1/23.swf">
<PARAM NAME=quality VALUE=high> <PARAM NAME=scale VALUE=noscale> <PARAM NAME=salign VALUE=LT>
<PARAM NAME=wmode VALUE=transparent> <PARAM NAME=bgcolor VALUE=#FFFFFF>
<PARAM NAME=flashvars VALUE="points=141690,8218&lang=ru&um=00000">
<EMBED src="http://rp5.ru/informer/group/1/23.swf" quality=high scale=noscale salign=LT wmode=transparent
bgcolor=#FFFFFF  WIDTH="160" HEIGHT="113" NAME="loader" flashvars="points=141690,8218&lang=ru&um=00000" ALIGN=""
TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
WIDTH="160" HEIGHT="113" id="loader" ALIGN=""> <PARAM NAME=movie VALUE="http://rp5.ru/informer/group/1/16.swf">
<PARAM NAME=quality VALUE=high> <PARAM NAME=scale VALUE=noscale> <PARAM NAME=salign VALUE=LT>
<PARAM NAME=wmode VALUE=transparent> <PARAM NAME=bgcolor VALUE=#FFFFFF>
<PARAM NAME=flashvars VALUE="points=141690,5485&lang=ru&um=00000">
<EMBED src="http://rp5.ru/informer/group/1/16.swf" quality=high scale=noscale salign=LT wmode=transparent
bgcolor=#FFFFFF  WIDTH="160" HEIGHT="113" NAME="loader" flashvars="points=141690,5485&lang=ru&um=00000" ALIGN=""
TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>
11.04.2015 12:11:48
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,279
У нас с: Aug 2011
Сообщение: #35
RE: Модификация скрипта плавной смены изображений на jQuery
Плавной смены информеров не получится, т.к. это не изображения, но можно сделать просто поочередную смену без использования jQuery:
Код:
<span id="slide_text">Тут будет информер</span>

<script type="text/javascript">
var text = ['<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'+
'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"'+
'WIDTH="160" HEIGHT="113" id="loader" ALIGN=""> <PARAM NAME=movie VALUE="http://rp5.ru/informer/group/1/29.swf">'+
'<PARAM NAME=quality VALUE=high> <PARAM NAME=scale VALUE=noscale> <PARAM NAME=salign VALUE=LT>'+
'<PARAM NAME=wmode VALUE=transparent> <PARAM NAME=bgcolor VALUE=#FFFFFF>'+
'<PARAM NAME=flashvars VALUE="points=141690,8218&lang=ru&um=00000">'+
'<EMBED src="http://rp5.ru/informer/group/1/29.swf" quality=high scale=noscale salign=LT wmode=transparent'+
'bgcolor=#FFFFFF WIDTH="160" HEIGHT="113" NAME="loader" flashvars="points=141690,8218&lang=ru&um=00000" ALIGN=""'+
'TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>',
'<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'+
'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"'+
'WIDTH="160" HEIGHT="113" id="loader" ALIGN=""> <PARAM NAME=movie VALUE="http://rp5.ru/informer/group/1/23.swf">'+
'<PARAM NAME=quality VALUE=high> <PARAM NAME=scale VALUE=noscale> <PARAM NAME=salign VALUE=LT>'+
'<PARAM NAME=wmode VALUE=transparent> <PARAM NAME=bgcolor VALUE=#FFFFFF>'+
'<PARAM NAME=flashvars VALUE="points=141690,8218&lang=ru&um=00000">'+
'<EMBED src="http://rp5.ru/informer/group/1/23.swf" quality=high scale=noscale salign=LT wmode=transparent'+
'bgcolor=#FFFFFF WIDTH="160" HEIGHT="113" NAME="loader" flashvars="points=141690,8218&lang=ru&um=00000" ALIGN=""'+
'TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>',
'<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'+
'codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"'+
'WIDTH="160" HEIGHT="113" id="loader" ALIGN=""> <PARAM NAME=movie VALUE="http://rp5.ru/informer/group/1/16.swf">'+
'<PARAM NAME=quality VALUE=high> <PARAM NAME=scale VALUE=noscale> <PARAM NAME=salign VALUE=LT>'+
'<PARAM NAME=wmode VALUE=transparent> <PARAM NAME=bgcolor VALUE=#FFFFFF>'+
'<PARAM NAME=flashvars VALUE="points=141690,5485&lang=ru&um=00000">'+
'<EMBED src="http://rp5.ru/informer/group/1/16.swf" quality=high scale=noscale salign=LT wmode=transparent'+
'bgcolor=#FFFFFF WIDTH="160" HEIGHT="113" NAME="loader" flashvars="points=141690,5485&lang=ru&um=00000" ALIGN=""'+
'TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED></OBJECT>'];

slide_text.innerHTML=text[0];

var n=1;
time=800;
play=setInterval("chgImg()", 4000);

function chgImg() {
    slide_text.innerHTML=text[n];
    n++;
    if (n>=text.length) n=0;
}
</script>
11.04.2015 14:17:34
Найти все сообщения Цитировать это сообщение
PTslawa681 Не на форуме
Рядовой
*

Сообщений: 2
У нас с: Apr 2015
Сообщение: #36
RE: Модификация скрипта плавной смены изображений на jQuery
Огромное спасибо за помощь!!!
Возможно сделать ещё и в виде карусели как здесь: exsoft.ucoz.com/load/skripty_dlja_ucoz/karusel_iz_kartinok/1-1-0-16

Заранее благодарен
11.04.2015 14:40:35
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,279
У нас с: Aug 2011
Сообщение: #37
RE: Модификация скрипта плавной смены изображений на jQuery
Нет, т.к. там используются простые изображения.
11.04.2015 14:54:03
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,279
У нас с: Aug 2011
Сообщение: #38
RE: Модификация скрипта плавной смены изображений на jQuery
В данной модификации изображение и текст к изображению являются ссылкой на страничку. При плавной смене изображения ссылка и текст так же меняются.

Код целиком:
Код:
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

<a id="slide_url" href="index.php">
    <img src="image/img_1.png" alt="" id="slide_show"><br>
    <span id="slide_text">Картинка 1</span>
</a>

<script type="text/javascript">
var imgs = ["image/img_1.png","image/img_2.png","image/img_3.png","image/img_4.png"];
var url = ["index.php","script.php","trick.php","forum/index.php"];
var text = ['Картинка 1','Картинка 2','<font color="red">Картинка 3</font>','Картинка 4'];
var n=0;
time=800;
play=setInterval("chgImg(0)", 4000);

function chgImg(number) {
if (number!=0) n=number-2;
$('#slide_url').fadeOut(time, function() {
    $(this).attr({"href":url[n]});
    $('#slide_show').attr("src", imgs[n]);
    $('#slide_text').html(text[n]);
}).fadeIn(time);

n++;
if (n>=imgs.length) n=0;
}
</script>
11.05.2015 18:44:26
Найти все сообщения Цитировать это сообщение
serg Не на форуме
Рядовой
*

Сообщений: 2
У нас с: Jul 2015
Сообщение: #39
RE: Модификация скрипта плавной смены изображений на jQuery
Здравствуйте. У меня имеется вот такой код смены картинок.

Код:
<script language="JavaScript1.1">
<!--

//specify interval between slide (in mili seconds)
var slidespeed=3000

//specify images
var slideimages=new Array("http://xaoc34rus.ucoz.ru/kartinki/li4noe/fantazy1.jpg",
"http://xaoc34rus.ucoz.ru/kartinki/li4noe/fantazy2.jpg",
"http://xaoc34rus.ucoz.ru/kartinki/li4noe/mishka1600x800.jpg")

//specify corresponding links
var slidelinks=new Array("ЗДЕСЬ ССЫЛКА ОТКРЫТИЯ ПРИ НАЖАТИИ НА ФОТО","ЗДЕСЬ ССЫЛКА ОТКРЫТИЯ ПРИ НАЖАТИИ НА ФОТО","ЗДЕСЬ ССЫЛКА ОТКРЫТИЯ ПРИ НАЖАТИИ НА ФОТО")

var newwindow=1 //open links in new window? 1=yes, 0=no

var imageholder=new Array()
var ie=document.all
for (i=0;i<slideimages.length;i++){
imageholder[i]=new Image()
imageholder[i].src=slideimages[i]
}

function gotoshow(){
if (newwindow)
window.open(slidelinks[whichlink])
else
window.location=slidelinks[whichlink]
}

//-->
</script>
<a href="javascript:gotoshow()"><img src="al1.gif" name="slide" border=0 style="filter:blendTrans(duration=3)" width=600 height=800></a>

<script language="JavaScript1.1">
<!--

var whichlink=0
var whichimage=0
var blenddelay=(ie)? document.images.slide.filters[0].duration*1000 : 0
function slideit(){
if (!document.images) return
if (ie) document.images.slide.filters[0].apply()
document.images.slide.src=imageholder[whichimage].src
if (ie) document.images.slide.filters[0].play()
whichlink=whichimage
whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0
setTimeout("slideit()",slidespeed+blenddelay)
}
slideit()

//-->
</script>

Хотел бы создать 2, либо 3 блока со сменной картинок на одной странице именно с данным скриптом. Создал первый блок с картинками и ссылками. Он хорошо работает. Создал второй блок с картинками и ссылками и он уже не работает. Можете помочь мне так чтобы и первый и второй и последующие блоки смены картинок работали. Заранее благодарен.
01.07.2015 21:38:17
Найти все сообщения Цитировать это сообщение
Admin Не на форуме
Верховный
Главнокомандующий
(Administrator)
*

Сообщений: 2,279
У нас с: Aug 2011
Сообщение: #40
RE: Модификация скрипта плавной смены изображений на jQuery
Тут придется практически все менять... Позже попробую что-нибудь придумать.
02.07.2015 00:07:51
Найти все сообщения Цитировать это сообщение
Создать ответ 


Переход:


Пользователи просматривают эту тему: 1 Гость(ей)



Mail.ru LiveInternet

© Copyright 2011-2016 by UsefulScript.ru