Слайд-шоу в сообщениях на форуме.
(Новый Вариант) на базе галереи iload
Слайд шоу запускается по клику на картинку -(* на картинке показано нажатие на кнопку "Cлайд-Шоу Автоплей",
Можно пролистывать картинки и в ручном режиме:
Либо стрелочками в нижнем меню:
Либо по клику на правую (вперед) - левую(назад) части изображения
Клик по черному полю -ескейп или сонтрл - возврат в топик
Если экран не позволяет увидеть полную картинку, есть Возможность просмотреть полное превью:
Кликая на кнопку "Оригинал"
Для полного Просмотра полномасштабного изображения - его можно перемещать по экрану зажав на нём левую клавишу мыши
(*Отпускание - второй клик "мышкой"
В HTML низ:
<!--Слайдшоу в Топике --> <script>if('\v'=='v'){$(document).ready(function(){ $.getScript("https://forumstatic.ru/files/0010/b4/f8/96425.js");}); } else {$.getScript("https://forumstatic.ru/files/0010/b4/f8/96425.js");} </script> <script type="text/javascript"> /******************************************************** МАССИВ ССЫЛОК НА КАРТИНКИ, ИСКЛЮЧАЕМЫХ ИЗ СЛАЙД-ШОУ ********************************************************/ var Arr_notPreview =[ "http://savepic.ru/2352396.gif", "https://forumupload.ru/uploads/000c/fa/7e/560-1.gif", "https://forumupload.ru/uploads/000c/fa/7e/558-2.gif", "End" ]; // var guest_access=true; </script> <style> .Obrml1{ border:outset #fff 1px; margin-bottom:2px; } .L_5 { background-attachment: scroll; background-clip: border-box; background-color: #000000; background-image: none; background-origin: padding-box; background-position: 0% 0%; background-repeat: repeat; background-size: auto; z-index: 9999; position: fixed; } .L_5, .L_6, .L_7 { left: 0px; top: 0px; width: 100%; height: 100%; display: block; } .Obrml{ border:solid #fff 1px; border-width:7px 7px 12px 7px; } .tipsy .tipsy-inner { letter-spacing:1px!important; } .tipsy.slide .tipsy-inner { font-size:12px!important; } </style> <!--<link rel="stylesheet" href="https://forumstatic.ru/files/0010/b4/f8/26092.css"/>--> <script> //8888888888888 = 19 ИЮНЯ 2012Г.: ОБНОВЛЕННЫЙ UPLOADS.RU = 888888888888888888// $(".post-content .postimg").parent("a[href*='http://uploads.ru/?v=']").each(function(){ var a=($(this).attr("href")); a=a.replace('http://uploads.ru/?v=','http://s1.uploads.ru/i/'); $(this).attr("href",a); }); //8888888888888 = СЛАЙД-ШОУ В СООБЩЕНИЯХ ТОПИКА = 888888888888888888// if($("#pun-viewtopic").length){if(typeof(guest_access)=='undefined'){var guest_access=false;} var FirstCheck_to_HOST=true; $(".post .post-body img[src^='/uploads/']").each(function(){ $(this).addClass("postimg"); $(this).attr("alt",$(this).attr("src")); }); if(typeof(Arr_notPreview)!='undefined'){ for(var i=0; i<(Arr_notPreview.length-1); i++){ $(".post img[src='"+Arr_notPreview[i]+"'].postimg").each(function(){ $(this).addClass("notPreview"); }); }} //888888888888888 = ANALIZ and SETTIN = 888888888888888888// $(".post a .postimg").each(function(){ var a1=$(this).parent("a").attr("href"); var a2=$(this).attr("src"); var a3=$(this).attr("alt"); var a=a1.replace(/^\S*\/click\.php\?/img,'')//убрали Кликер-переход; $(this).parents("a").attr("href",a) //убрали Кликер-переход из a var img_extens=['jpg','png','gif','jpeg'] var ImgExt=false,aNotExt;for(var i in img_extens){ var pattern="\\."+img_extens[i]+"$";var regexp=new RegExp(pattern,"img"); aNoExt=a.replace(regexp,''); if(a!=aNoExt){ImgExt=true;break}}; if(ImgExt){var S=aNoExt.replace(/\S{5}\/\/uploads\.ru\/\?v=/img,''); if(S!=aNoExt){S=a.replace(/\S{5}\/\/uploads\.ru\/\?v=/img,''); S=a3.replace(/\/[^\/]*$/img,'/'+S);a=S.replace(/\/\/uploads.ru\/t\//img,'//uploads.ru/i/')}; } else {if(a.indexOf("http://savepic")!=-1){ S=a3.replace(/m(\.\S{3,4})$/img,'$1');if(S!=a3){a=S;ImgExt=true;}} } if(ImgExt){ if($.trim(a)!=''){$(this).attr("alt",a);$(this).parents("a").attr("href",a)} else{$(this).parents("a").attr("href",$(this).attr("src"));} }else {$(this).parents("a").addClass("hTml")} }); function SetIload(a){ a.addClass("Iload");a.find(".postimg").attr("title","Просмотр Слайд-шоу?"); a.attr("rel","iLoad|Post-image"); var b = a.parents(".post").find(".pa-author a").text();//alert(b) var c = a.parents(".post").find("h3:first span strong:first").text();//alert(c) str="|post "+c+"; Aвтор: "+b; a.attr("a-title",str);a.attr("title",str); } function ImgPostLoad(){ $(".post .postimg").not(".notPreview").each(function(){ var w = parseInt($(this).width(),10);//alert(w) var h = parseInt($(this).height(),10);j=w-14; var a = $(this).parents("a"); var b = $(this).attr("alt"); var c = '<span class=Obrml1 style="display:inline-block;"><span class=Obrml style="width:'+j+'px;display:inline-block;"></span></span>'; if(a.length){$(this).addClass("Ref")} else { if(w>67 && h > 65){ $(this).addClass("NoRef");$(this).wrap('<a href="'+b+'" target="_blank"></a>'); }} a=$(this).parents("a"); if(!a.hasClass("hTml")){SetIload($(this).parent("a"));a.wrap(c); }else {a.attr("title","Переход по ссылке");} }); } var tst='<div id=show_stLoad style="width:100%;height:12px;border:none transparent;visibility:hidden;"><img id="Gif_test" style="height:100%;width:100%;" src="../i/blank.gif" /></div>'; $("#html-footer").prepend(tst); function AnimTstLoad(){var a=$("#show_stLoad1,#t_stLoad"),b=$("#show_stLoad1 *"); b.animate({opacity:.05},1800,"linear", function(){a.replaceWith("");});} function TstLoad(){var a=$("#Gif_test").height(); if(a>11){ImgPostLoad()}else {timerID = setTimeout("TstLoad()",100);return;}} if(GroupID!=3||guest_access){TstLoad(); $(".post .Iload .postimg").mousedown(function(){ $(this).parent(".Iload").attr("title",$(this).parent(".Iload").attr("a-title")); }); $(".post .Iload .postimg").mouseover(function(){ $(this).parents(".Iload").removeAttr("title") }).mouseout(function(){ $(this).parents(".Iload").attr("title",$(this).parents(".Iload").attr("a-title")) }); $("#pun-viewtopic a.Iload img.postimg").tipsy({live: true, gravity: 'w slide'}); $("#pun-viewtopic a.hTml").tipsy({live: true, gravity: 'w slide'}); } }//End //if($("#pun-viewtopic").length)// </script> <!-- End//Слайдшоу в Топике -->
Пояснения.
Расмотрим вот этот кусок скрипта:
<script type="text/javascript">
/********************************************************
МАССИВ ССЫЛОК НА КАРТИНКИ, ИСКЛЮЧАЕМЫХ ИЗ СЛАЙД-ШОУ
********************************************************/
var Arr_notPreview =[
"http://savepic.ru/2352396.gif",
"https://forumupload.ru/uploads/000c/fa/7e/560-1.gif",
"https://forumupload.ru/uploads/000c/fa/7e/558-2.gif",
"End" ];
// var guest_access=true;
</script>
Красным -массив ссылок, исключаемых из слайд шоу(Обычно это слишком крупные смайлы
Cиним - две косые черты - удаляем - если нужен просмотр слайд-шоу под гостем
Да - не злоупотребляйте много-повтором слишком больших смайлов (или прописывайте их в исключения к показу...
=======================
Поправлено 2.07.2012
Теги: Новые Скрипты
Отредактировано Deff (2012-07-03 12:12:48)