Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 06.03.2014, 16:08
Интересующийся
Отправить личное сообщение для makissm21 Посмотреть профиль Найти все сообщения от makissm21
 
Регистрация: 05.07.2013
Сообщений: 11

lightbox title не работают ссылки
Всем привет, может есть специалисты по LightBox
Не могу понять, почему не работает ссылка в теге title=""

Способы с заменой html символов не помогло, еще пробовал несколько способов из инета, они тоже не помогли, может здесь кто поможет?

сам шаблон test3.cmski.ru
блок Recent Works нажать на картинку и внизу розовым ссылка. скрин http://shot.qip.ru/00jIPZ-6zuH5Xu7R/

Заранее очень благодарен за любую помощь.
Ответить с цитированием
  #2 (permalink)  
Старый 07.03.2014, 00:08
Интересующийся
Отправить личное сообщение для makissm21 Посмотреть профиль Найти все сообщения от makissm21
 
Регистрация: 05.07.2013
Сообщений: 11

Видимо очень сложная задача, раз все стороной проходят.
Ответить с цитированием
  #3 (permalink)  
Старый 07.03.2014, 01:00
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

makissm21,
недоходчиво описано -- ссылка на шаблон должна быть ссылкой вот так http://test3.cmski.ru/

-- решение вашей проблемы - разрешить плагину LightBox реагировать на ссылки -- придумайте метку класс -- если клик по этому классу осуществляем переход -- сам плагин блокирует все клики которые не являются частью его интерфейса.
и тогда будет всё ок!

Последний раз редактировалось рони, 07.03.2014 в 01:33.
Ответить с цитированием
  #4 (permalink)  
Старый 07.03.2014, 02:12
Интересующийся
Отправить личное сообщение для makissm21 Посмотреть профиль Найти все сообщения от makissm21
 
Регистрация: 05.07.2013
Сообщений: 11

Решение дали на другом форуме не давно.
Спасибо за совет.
Ответить с цитированием
  #5 (permalink)  
Старый 07.03.2014, 02:38
Аватар для Zuenf
Кандидат Javascript-наук
Отправить личное сообщение для Zuenf Посмотреть профиль Найти все сообщения от Zuenf
 
Регистрация: 27.01.2012
Сообщений: 134

Рони, ты эмулировал стандартное поведение, типа
window.location.replace($(this).attr('href'));

или как-то можно отменить отмену действия по умолчанию?
Ответить с цитированием
  #6 (permalink)  
Старый 07.03.2014, 02:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Zuenf,
поставил в плагин запрет реагировать на ссылки с с определённым классом -- в title добавил класс -
title="<a href="http://www.google.ru/" class="google" >Ссылка1</a>" -- понял что это неудобно и титле не для этого и сделал
data-link='{"href":"http://www.google.ru/","text":"ссылка"}' - если есть этот атрибут плагин если ему шепнуть формирует ссылку и ненадо портить титле.
Ответить с цитированием
  #7 (permalink)  
Старый 07.03.2014, 03:36
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Zuenf,
если интересно
<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <link rel="stylesheet" type="text/css" href="http://lokeshdhakar.com/projects/lightbox2/css/lightbox.css">
  <style type="text/css">
  .google{
    font-size: 24px;
    color: #FFFFFF;
  }
  </style>
  <script src='http://code.jquery.com/jquery-latest.js'></script>
  <script>(function(){var a,k,l;a=jQuery;l=function(){function a(){this.fadeDuration=500;this.fitImagesInViewport=!0;this.resizeDuration=700;this.showImageNumberLabel=!0;this.wrapAround=!1}a.prototype.albumLabel=function(b,c){return"Image "+b+" of "+c};return a}();k=function(){function d(b){this.options=b;this.album=[];this.currentImageIndex=void 0;this.init()}d.prototype.init=function(){this.enable();return this.build()};d.prototype.enable=function(){var b=this;return a("body").on("click","a[rel^=lightbox], area[rel^=lightbox], a[data-lightbox], area[data-lightbox]", function(c){b.start(a(c.currentTarget));return!1})};d.prototype.build=function(){var b=this;a("<div id='lightboxOverlay' class='lightboxOverlay'></div><div id='lightbox' class='lightbox'><div class='lb-outerContainer'><div class='lb-container'><img class='lb-image' src='' /><div class='lb-nav'><a class='lb-prev' href='' ></a><a class='lb-next' href='' ></a></div><div class='lb-loader'><a class='lb-cancel'></a></div></div></div><div class='lb-dataContainer'><div class='lb-data'><div class='lb-details'><span class='lb-caption'></span><span class='lb-number'></span></div><div class='lb-closeContainer'><a class='lb-close'></a></div></div></div></div>").appendTo(a("body")); this.$lightbox=a("#lightbox");this.$overlay=a("#lightboxOverlay");this.$outerContainer=this.$lightbox.find(".lb-outerContainer");this.$container=this.$lightbox.find(".lb-container");this.containerTopPadding=parseInt(this.$container.css("padding-top"),10);this.containerRightPadding=parseInt(this.$container.css("padding-right"),10);this.containerBottomPadding=parseInt(this.$container.css("padding-bottom"),10);this.containerLeftPadding=parseInt(this.$container.css("padding-left"),10);this.$overlay.hide().on("click", function(){b.end();return!1});this.$lightbox.hide().on("click",function(c){if(a(c.target).hasClass("google"))return!0;"lightbox"===a(c.target).attr("id")&&b.end();return!1});this.$outerContainer.on("click",function(c){"lightbox"===a(c.target).attr("id")&&b.end();return!1});this.$lightbox.find(".lb-prev").on("click",function(){0===b.currentImageIndex?b.changeImage(b.album.length-1):b.changeImage(b.currentImageIndex-1);return!1});this.$lightbox.find(".lb-next").on("click",function(){b.currentImageIndex=== b.album.length-1?b.changeImage(0):b.changeImage(b.currentImageIndex+1);return!1});return this.$lightbox.find(".lb-loader, .lb-close").on("click",function(){b.end();return!1})};d.prototype.start=function(b){var c,e,d,f,g,h;a(window).on("resize",this.sizeOverlay);a("select, object, embed").css({visibility:"hidden"});this.$overlay.width(a(document).width()).height(a(document).height()).fadeIn(this.options.fadeDuration);this.album=[];d=0;if(c=b.attr("data-lightbox"))for(h=a(b.prop("tagName")+'[data-lightbox="'+ c+'"]'),e=f=0,g=h.length;f<g;e=++f)c=h[e],this.album.push({link:a(c).attr("href"),title:a(c).data("link")?'<a href="'+a(c).data("link").href+'" class="google">'+a(c).data("link").text+"</a>":a(c).attr("title")}),a(c).attr("href")===b.attr("href")&&(d=e);else if("lightbox"===b.attr("rel"))this.album.push({link:b.attr("href"),title:b.attr("title")});else for(h=a(b.prop("tagName")+'[rel="'+b.attr("rel")+'"]'),e=f=0,g=h.length;f<g;e=++f)c=h[e],this.album.push({link:a(c).attr("href"),title:a(c).attr("title")}), a(c).attr("href")===b.attr("href")&&(d=e);c=a(window);b=c.scrollTop()+c.height()/10;c=c.scrollLeft();this.$lightbox.css({top:b+"px",left:c+"px"}).fadeIn(this.options.fadeDuration);this.changeImage(d)};d.prototype.changeImage=function(b){var c,e,d=this;this.disableKeyboardNav();c=this.$lightbox.find(".lb-image");this.sizeOverlay();this.$overlay.fadeIn(this.options.fadeDuration);a(".lb-loader").fadeIn("slow");this.$lightbox.find(".lb-image, .lb-nav, .lb-prev, .lb-next, .lb-dataContainer, .lb-numbers, .lb-caption").hide(); this.$outerContainer.addClass("animating");e=new Image;e.onload=function(){var f,g;c.attr("src",d.album[b].link);a(e);c.width(e.width);c.height(e.height);d.options.fitImagesInViewport&&(f=a(window).width(),g=a(window).height(),f=f-d.containerLeftPadding-d.containerRightPadding-20,g=g-d.containerTopPadding-d.containerBottomPadding-110,e.width>f||e.height>g)&&(e.width/f>e.height/g?(g=f,f=parseInt(e.height/(e.width/g),10)):(f=g,g=parseInt(e.width/(e.height/f),10)),c.width(g),c.height(f));return d.sizeContainer(c.width(), c.height())};e.src=this.album[b].link;this.currentImageIndex=b};d.prototype.sizeOverlay=function(){return a("#lightboxOverlay").width(a(document).width()).height(a(document).height())};d.prototype.sizeContainer=function(b,c){var a,d,f=this;this.$outerContainer.outerWidth();this.$outerContainer.outerHeight();d=b+this.containerLeftPadding+this.containerRightPadding;a=c+this.containerTopPadding+this.containerBottomPadding;this.$outerContainer.animate({width:d,height:a},this.options.resizeDuration,"swing"); setTimeout(function(){f.$lightbox.find(".lb-dataContainer").width(d);f.$lightbox.find(".lb-prevLink").height(a);f.$lightbox.find(".lb-nextLink").height(a);f.showImage()},this.options.resizeDuration)};d.prototype.showImage=function(){this.$lightbox.find(".lb-loader").hide();this.$lightbox.find(".lb-image").fadeIn("slow");this.updateNav();this.updateDetails();this.preloadNeighboringImages();this.enableKeyboardNav()};d.prototype.updateNav=function(){this.$lightbox.find(".lb-nav").show();1<this.album.length&& (this.options.wrapAround?this.$lightbox.find(".lb-prev, .lb-next").show():(0<this.currentImageIndex&&this.$lightbox.find(".lb-prev").show(),this.currentImageIndex<this.album.length-1&&this.$lightbox.find(".lb-next").show()))};d.prototype.updateDetails=function(){var b=this;"undefined"!==typeof this.album[this.currentImageIndex].title&&""!==this.album[this.currentImageIndex].title&&this.$lightbox.find(".lb-caption").html(this.album[this.currentImageIndex].title).fadeIn("fast");1<this.album.length&& this.options.showImageNumberLabel?this.$lightbox.find(".lb-number").text(this.options.albumLabel(this.currentImageIndex+1,this.album.length)).fadeIn("fast"):this.$lightbox.find(".lb-number").hide();this.$outerContainer.removeClass("animating");this.$lightbox.find(".lb-dataContainer").fadeIn(this.resizeDuration,function(){return b.sizeOverlay()})};d.prototype.preloadNeighboringImages=function(){var b;this.album.length>this.currentImageIndex+1&&(b=new Image,b.src=this.album[this.currentImageIndex+1].link); 0<this.currentImageIndex&&(b=new Image,b.src=this.album[this.currentImageIndex-1].link)};d.prototype.enableKeyboardNav=function(){a(document).on("keyup.keyboard",a.proxy(this.keyboardAction,this))};d.prototype.disableKeyboardNav=function(){a(document).off(".keyboard")};d.prototype.keyboardAction=function(b){var a;a=b.keyCode;b=String.fromCharCode(a).toLowerCase();27===a||b.match(/x|o|c/)?this.end():"p"===b||37===a?0!==this.currentImageIndex&&this.changeImage(this.currentImageIndex-1):"n"!==b&&39!== a||this.currentImageIndex===this.album.length-1||this.changeImage(this.currentImageIndex+1)};d.prototype.end=function(){this.disableKeyboardNav();a(window).off("resize",this.sizeOverlay);this.$lightbox.fadeOut(this.options.fadeDuration);this.$overlay.fadeOut(this.options.fadeDuration);return a("select, object, embed").css({visibility:"visible"})};return d}();a(function(){var a;a=new l;return new k(a)})}).call(this);</script>
</head>

<body>
<a title="нормальная подсказка" data-link='{"href":"http://javascript.ru/forum/","text":"ссылка на форум"}' data-lightbox="set1" href="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"  ><img alt="" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"></a>
<a title="нормальная подсказка" data-link='{"href":"http://javascript.ru/forum/","text":"ссылка на форум"}' data-lightbox="set1" href="http://javascript.ru/forum/images/smilies/agree.gif"  ><img alt="" src="http://javascript.ru/forum/images/smilies/agree.gif"></a>
</body>
</html>
Ответить с цитированием
  #8 (permalink)  
Старый 07.03.2014, 04:49
Аватар для Zuenf
Кандидат Javascript-наук
Отправить личное сообщение для Zuenf Посмотреть профиль Найти все сообщения от Zuenf
 
Регистрация: 27.01.2012
Сообщений: 134

рони, Ну ты конечно молодец!
Написал, мне как пользоваться, а что ты добавил в скрипт я полчаса сидел искал.

Сначала думал, что в исходниках lightbox, есть какая то нативная обработка. Не нашел.
Вообще, я не очень знаком был с data-*. Почитал.
Посмотрел в jQuery, есть какие-то функции работающие с такими атрибутами.
Опять начал искать в исходниках lightbox.
Уже практически наизусть их выучил, как решил проверить, может ты там что-то добавил, жму ctr-f, ввожу link, и о чудо(хорошо я исходники наизусть запомнил), я понял что нашел это!

А про титле я вообще сидел в ступоре, и в моей голове: "Что? Зачем? Коим образом он связан с классом?" и т.п.

Последний раз редактировалось Zuenf, 07.03.2014 в 05:01.
Ответить с цитированием
  #9 (permalink)  
Старый 07.03.2014, 09:40
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Zuenf,
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
не работают ссылки учебника dmitry111 Сайт Javascript.ru 0 11.02.2013 09:43
Ссылки внутри другой ссылки Madgeniy Events/DOM/Window 4 11.08.2012 14:58
Не работают ссылки на странице Timonovsky Общие вопросы Javascript 3 27.10.2010 02:18
Помогите не работает скрипт MAX_NS Общие вопросы Javascript 2 24.03.2009 16:25
Вопрос к гуру. Title через js. Не выводит title из тега <TR> shkur Элементы интерфейса 24 19.06.2008 09:03