ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка

Объявление

АКЦИЯ: Раздаём дизайны бесплатно

Доработаем макет под ваш проект;
Сверстаем;
Сделаем мобильную версию по желанию.

Подробнее

Поисковой ресурс

Проект от команды FD
для текстовых ролевиков

Спойлеры и обсуждение

Мийрон

Качественный пиар быстро и недорого.
Красивейшие дизайны по низким ценам.
Каталог ролевых игр.

Подробнее

FD Chat - Чат на вашем форуме

Чат на отдельной странице на форуме. Без регистрации, используются форумные аккаунты.
Стоимость: 1500р
Первым 10 покупателям скидка 20%.

Подробнее

Макет для сайта «Fantasy Calalogue»

Детализированный макет «Fantasy catalogue» для тёмного дизайна многостраничного сайта
Стоимость при покупке эксклюзивно: 3600р
В стоимость входит корректировка макета и доработка недостающих страничек под ваш проект.

Подробнее

Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Реклама на сайтеПредложения
Стать модераторомОтзывы

Подробнее
Конкурс! Интерфейс и взаимодействие! Главный приз - 2000 рублей.
Ищешь чем бы украсить свой форум или сайт к Новому году? 🎄 Мы поможем нарядиться! 🎄
❗ ❗ ❗ Technical work is underway. Something here and there may be crooked. We'll fix it soon. :)

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.



Слайд-шоу в сообщениях на форуме

Сообщений 1 страница 10 из 17

1

Слайд-шоу в сообщениях на форуме.
(Новый Вариант) на базе галереи iload

По клику на картинки в сообщениях происходит запуск слайдшоу с прокруткой картинок.
http://gerda.moy.su/_bd/0/s07229142.jpg

Автор: Deff
Платформа: MyBB

Слайд шоу запускается по клику на картинку -(* на картинке показано нажатие на кнопку "Cлайд-Шоу Автоплей",
http://gerda.moy.su/_bd/0/s07229142.jpg
Можно пролистывать картинки и в ручном режиме:
Либо стрелочками в нижнем меню:
Либо по клику на правую (вперед) - левую(назад) части изображения
Клик по черному полю - ескейп или контрл - возврат в топик

Если экран не позволяет увидеть полную картинку, есть возможность просмотреть полное превью:
Кликая на кнопку "Оригинал"
http://gerda.moy.su/_bd/0/s36944785.jpg

Для полного просмотра полномасштабного изображения его можно перемещать по экрану зажав на нём левую клавишу мыши
(Отпускание - второй клик "мышкой")
http://gerda.moy.su/_bd/0/s51096738.jpg


В 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/');
});
//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иним - две косые черты. Удаляем, если нужен просмотр слайд-шоу под гостем.


PS не злоупотребляйте много-повтором слишком больших смайлов (или прописывайте их в исключения к показу...

Отредактировано Герда (20.05.13 01:19)

Подпись автора

Просьба не писать в ЛС, этот аккаунт исключительно для публикаций.

+1

2

[mod]Обновлено.[/mod]

Подпись автора

Просьба не писать в ЛС, этот аккаунт исключительно для публикаций.

0

3

http://uploads.ru/i/R/j/9/Rj9lU.gif Чичас там версия - занчительно интереснее, на базе iload

Отредактировано Deff (04.02.12 18:35)

+1

4

Deff, обновила, спасибо.

Подпись автора

Просьба не писать в ЛС, этот аккаунт исключительно для публикаций.

+1

5

(*faiko, Ксать удобная Весчь - опробовала бы, бордеры  можно убрать выставляя нулевую ширину бордюра

Отредактировано Deff (10.02.12 09:18)

0

6

В слайд -шоу нашел Ошибку - поправил http://forum.mybb.ru/viewtopic.php?pid=734090#p734090

Отредактировано Deff (16.05.13 05:46)

+2

7

Deff написал(а):

Ксать удобная Весчь - опробовала бы, бордеры  можно убрать выставляя нулевую ширину бордюра

Мне оно пока ни к чему, но тестила, видела - чудесная вещь, для форумов с большим количеством графики самое то. http://uploads.ru/i/i/C/H/iCH7e.gif

Deff написал(а):

В слайд -шоу нашел Ошибку - поправил

Ага.

Подпись автора

Просьба не писать в ЛС, этот аккаунт исключительно для публикаций.

+1

8

Спс

0

9

а можно этот скрипт адаптировать так, чтобы слайд-шоу начиналось с той картинки на которую кликнули и шло по всей теме дальше, а не зацикливалось на одном сообщении?

0

10

птах Левая кнопка на первой всплывающей картинке, см первый скриншот! (*Ну или ткните в DEMке

Отредактировано Deff (27.02.12 22:37)

+1