Тема: PHP и jquery
Показать сообщение отдельно
  #2 (permalink)  
Старый 11.07.2012, 21:24
Аватар для zlodeeev
Кандидат Javascript-наук
Отправить личное сообщение для zlodeeev Посмотреть профиль Найти все сообщения от zlodeeev
 
Регистрация: 11.07.2012
Сообщений: 113

Вот так, но только надо бы photo.php подправить, флаг например добавить, чтобы если был клик по миниатюре - передавалось одно значение флага и соответсвенно выполнялась функция возвращающая ту самую структуру
$window_skillet = '
			<div class="window">'.
				'<div class="conteiner_content">'.
					'<div class="conteiner_info">'.
							'<a href="photos.php" class="close"></a>'.
					'</div>'.
					'<div class="content">'.
						'<div><a href="photos.php?photo='.$next.'"><img src="photos/'.$id.'.jpg" [B]class="big"[/B]/></a></div>'.
					'</div>'.
				'</div>'.
			'</div>		
		';


И аяксом подтянуть необходимое изображение вместе со структурой:

$.post("photos.php", { photo: $(this).attr('id')}    
function(data) {
     var structure_window = data;
   });


В итоге получим нечто подобное:
$(document).ready(function(){
	$('a[name=window]').click(function(){
		var id = $(this).attr('href');
		var content = $(id).html();
		var get_window = function(){
                $.post("photos.php", { photo: $(this).attr('id')}    
                function(data) {
                  var structure_window = data;
                });
		$('body').prepend(get_window());
		$('.window').fadeIn();
		if($('.conteiner_content').height()+60>=$(window).height()){
			$('body').css({'overflow':'hidden','padding-right':'17px'});
		} else{
			$('body').css({'overflow':'auto'});
		}
		return false;	
	});

        $('.big').click(function(){
           $.post("photos.php", { photo: $(this).attr('id')}    
             function(data) {
                $('div.window').html = data;
              });
        });

	$('.close').live('click', function(){		
		$('.window').remove();
		$('body').css({'overflow':'auto','padding':'0'});
		return false;
	});


});
Ответить с цитированием