Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   перебор фото (https://javascript.ru/forum/misc/31737-perebor-foto.html)

BelkinV 19.09.2012 10:31

перебор фото
 
вообщем не знаю как сделать следущее, есть div в нём ссылки с картинками (<a href="1.jpg"><img src="1.jpg"></a> - так вот), любое кол-во ссылок, при клике на ссылку с картинкой, открывется модальное окно, с выбрной картинкой и две кнопки назад и вперёд, нужно чтобы по клику на кнопки листались фото вперёд или назад, не знаю как получить ссылку на предыдущую картинку и следущу...точнее знаю но только на ближние от открытой, дальше них листать не получается, определяю ссылки не правильно.
var imglink = $(this).attr('href');
        var previmglink =$(this).prev('a').attr('href');
        var nextimglink =$(this).next('a').attr('href');

        $('.modal_content').html('<a href="#" class="prev">Дальше</a> <img src=""> <a href="#" class="next">Дальше</a>');
        $('.modal_content img').attr('src',imglink);

        $('.prev').click(function(){
            $('.modal_content img').attr('src',previmglink);
        });
        $('.next').click(function(){
            $('.modal_content img').attr('src',nextimglink);
        });

мой вариант, как сделать чтоб перелистывание было правильным?

walik 19.09.2012 12:15

Попробуйте так.
var imglink = $(this).attr('href');
var previmglink =$(this).prev('a');
var nextimglink =$(this).next('a');

$('.modal_content').html('<a href="#" class="prev">Дальше</a> <img src=""> <a href="#" class="next">Дальше</a>');
$('.modal_content img').attr('src',imglink);

$('.prev').click(function(){
   $('.modal_content img').attr('src',previmglink.attr('href'));
   nextimglink = previmglink.next('a');
   previmglink = previmglink.prev('a');
});
$('.next').click(function(){
   $('.modal_content img').attr('src',nextimglink.attr('href'));
   previmglink = nextimglink.prev('a');
   nextimglink = nextimglink.next('a');
});

BelkinV 19.09.2012 17:50

спасибо за помощь, но по другому уже реализовал
var ImgLink = $(this).attr('href');

        $('.modal_content').html('<img src=""><div class="helper"></div>');
        $('.modal_content img').css({'width': '434px'});
        $('.modal_content img').attr('src',ImgLink);


        $('.next_block').click(function(){
            var CurrentImg = $('.modal_content img').attr('src');
            var NextImg = $('#container').find('a[href^="'+CurrentImg+'"]').next('a').attr('href');
            $('.modal_content img').attr('src',NextImg);
        });

        $('.prev_block').click(function(){
            var CurrentImg = $('.modal_content img').attr('src');
            var PrevImg = $('#container').find('a[href^="'+CurrentImg+'"]').prev('a').attr('href');
            $('.modal_content img').attr('src',PrevImg);
        });


Часовой пояс GMT +3, время: 16:26.