X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> JS вопрос: Как добавить ссылку к картинке?
Rombi
Rombi
Topic Starter сообщение 25.3.2014, 18:45; Ответить: Rombi
Сообщение #1


3TAJIOH
******

Группа: Active User
Сообщений: 1042
Регистрация: 14.6.2010
Из: Самара
Поблагодарили: 244 раза
Репутация:   45  


Хочу сделать лайтбокс для картинок, которые больше определенной ширины.
Но почему-то никак не получается добавить тег A перед img и закрыть его после.
Перепробовал уже и append/prepend и children/parent и html и еще кучу всего.
Подскажите, плиз, как из обычной картинки сделать ссылку-картинку =)

Сообщение отредактировал Rombi - 25.3.2014, 18:47


--------------------
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ultimato
ultimato
сообщение 25.3.2014, 19:38; Ответить: ultimato
Сообщение #2


Новичок
*

Группа: User
Сообщений: 40
Регистрация: 13.7.2012
Поблагодарили: 6 раз
Репутация:   0  


Попробуй так с jQuery :)
Код
<!-- jQuery -->
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>

<script type="text/javascript" charset="utf8">
  $(document).ready(function(){
    var images = document.getElementsByTagName('img');
    for (var i = 0; i < images.length; i++) {
      var image = images[i];
      var parentElement = image.parentElement;
      var a = document.createElement('a');
      a.href = image.getAttribute('src');
      a.appendChild(image);
      parentElement.appendChild(a);
    }
  });
</script>


--------------------
Создание сайтов на WordPress и OpenCart
Верстка натяжка решение неисправности и.т.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Tollun
Tollun
сообщение 25.3.2014, 19:51; Ответить: Tollun
Сообщение #3


Старожил
******

Группа: Active User
Сообщений: 1595
Регистрация: 1.10.2009
Из: Хабаровск
Поблагодарили: 394 раза
Репутация:   66  


в ссылки должна быть ссылка из src?


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Rombi
Rombi
Topic Starter сообщение 25.3.2014, 20:06; Ответить: Rombi
Сообщение #4


3TAJIOH
******

Группа: Active User
Сообщений: 1042
Регистрация: 14.6.2010
Из: Самара
Поблагодарили: 244 раза
Репутация:   45  


ultimato, спасибо, помогло.

Tollun, разумеется)


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Tollun
Tollun
сообщение 25.3.2014, 20:08; Ответить: Tollun
Сообщение #5


Старожил
******

Группа: Active User
Сообщений: 1595
Регистрация: 1.10.2009
Из: Хабаровск
Поблагодарили: 394 раза
Репутация:   66  


Код
<script>
$(document).ready(function (){
  $('img').each(function(){
    var url = $(this).attr('src')
    $(this).wrap('<a href="'+ url +'"></a>')
  });
});
</script>


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ultimato
ultimato
сообщение 25.3.2014, 20:08; Ответить: ultimato
Сообщение #6


Новичок
*

Группа: User
Сообщений: 40
Регистрация: 13.7.2012
Поблагодарили: 6 раз
Репутация:   0  


Rombi, рад помочь :)


--------------------
Создание сайтов на WordPress и OpenCart
Верстка натяжка решение неисправности и.т.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Tollun
Tollun
сообщение 25.3.2014, 20:09; Ответить: Tollun
Сообщение #7


Старожил
******

Группа: Active User
Сообщений: 1595
Регистрация: 1.10.2009
Из: Хабаровск
Поблагодарили: 394 раза
Репутация:   66  


ultimato, извините конечно, но это не jquery а каша


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ultimato
ultimato
сообщение 25.3.2014, 20:17; Ответить: ultimato
Сообщение #8


Новичок
*

Группа: User
Сообщений: 40
Регистрация: 13.7.2012
Поблагодарили: 6 раз
Репутация:   0  


Tollun, Ну каждый по своему B)


--------------------
Создание сайтов на WordPress и OpenCart
Верстка натяжка решение неисправности и.т.


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Rombi
Rombi
Topic Starter сообщение 25.3.2014, 20:23; Ответить: Rombi
Сообщение #9


3TAJIOH
******

Группа: Active User
Сообщений: 1042
Регистрация: 14.6.2010
Из: Самара
Поблагодарили: 244 раза
Репутация:   45  


Узнал про функцию wrap =)
Вот мой код, может, кому-нить пригодится)

Код
    var $img = $('.img');
    $('.img').one('load',function(){
        var CurImg = $(this);
        var width  = CurImg.width();
        var src = CurImg.attr("src");

        if (width > 200){
        CurImg.wrap('<a href="'+src+'" rel="photos"></a>');
        }
    
    })
    .each(function(){
        if(this.complete) $(this).trigger('load');
    });


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
kRicha
kRicha
сообщение 25.3.2014, 22:13; Ответить: kRicha
Сообщение #10


Завсегдатай
*****

Группа: Active User
Сообщений: 932
Регистрация: 29.6.2010
Из: Киева
Поблагодарили: 222 раза
Репутация:   39  


Rombi, еще можно использовать методы before() и after()
;)


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Как заработать новичку?
107 Emeralda 17673 Сегодня, 14:59
автор: Smspva
Горячая тема (нет новых ответов) Как заставить Google любить тебя?
Хочу роста трафа из Гугла : ))
73 Aslan88 16197 Сегодня, 14:48
автор: coremission
Горячая тема (нет новых ответов) Черный список обменников и как безопасно обменять валюту
139 Kurses 29571 Сегодня, 14:45
автор: jack
Открытая тема (нет новых ответов) Естественные ссылки в деталях. Что из себя представляют, как добывать
seoandme.ru - SEO-блог Анны Ященко
0 AnnaYa 241 Сегодня, 10:56
автор: AnnaYa
Открытая тема (нет новых ответов) Как мошенники зарабатывают на прямых трансляциях в Instagram
Не ждите порно в инстаграм, его нет
3 PostBrigada 546 Сегодня, 9:50
автор: Mikki


 



RSS Текстовая версия Сейчас: 12.12.2017, 15:00
Дизайн