Меню
Что нового?

Вопрос про увеличение картинок

proWoke

Новичок
Вот есть такой вот код
PHP: 
	<div id="maingalery">

<p class="figure"><img src="<?=$data[0]['bigimg']?>" alt="" /></p>
<a class="prev browse left"></a>

<!-- root element for scrollable -->
<div class="scrollable">   
   
   <!-- root element for the items -->
   <div class="items">
   <? for ($i=0, $j=0; $i<$amount; $i++, $j+=5, $count-=5)  
   {?>
       <div>
	<? 
	if ($count>5) {$q=5;} else {$q=$count;}
	for ($k=$j; $k<$q+$j; $k++) {?>
	        <a href="#" onclick="show_img_middle('<?=$data[$k]['middleimg']?>')"><img src="<?=$data[$k]['miniimg']?>" alt="" /></a>
	<?}?> 
      </div>
 <?}?>
   </div>
   
</div>
<a class="next browse right"></a>
</div>
	
			</div>

Ссылки на картинки у меня выводятся из базы данных. Вот в этой строчке:
PHP: 
   <a href="#" onclick="show_img_middle('<?=$data[$k]['middleimg']?>')"><img src="<?=$data[$k]['miniimg']?>" alt="" /></a>
Выводятся миникартинка и средняя. Средняя картинка появляется в блоке :
PHP: 
<p class="figure"><img src="<?=$data[0]['bigimg']?>" alt="" /></p>
$data[0]['bigmg'] - тут это просто картинка по умолчанию, которая сначала стоит.
Так вопрос вот в чём. Как мне передать id когда я буду нажимать на среднюю картинку, чтобы открылся её большой брат? Т.е. по идеи должно быть так в блоке, где средняя картинка.
PHP: 
<a id="example" href="<?=$data[$k]['bigimg']?>"><p class="figure"><img src="<?=$data[0]['bigimg']?>" alt="" /></p>
А при нажатии на ссылку открывается большая картинка через эффект fancybox (или lightbox).
Помогите, пожалуйста. Если я, конечно, понятно обьяснил.
 
Mr_Max

Mr_Max

Первый класс. Зимние каникулы ^_^
Команда форума
Вопрос к ПХП не имеет ни малейшего отношения.
штмл код в студию.
 
Mr_Max

Mr_Max

Первый класс. Зимние каникулы ^_^
Команда форума
Ну ты же сам сказал - это то, что было.
Если у тебя проблемы с Джаваскриптом, то зачем мне смесь ПХП_И_ШТМЛ?

_____ЧИСТЫЙ_ШТМЛ_____ в студию
 

proWoke

Новичок
http://deluxe-okna.ru/blocks/parts/index.php?part=session#


Вот так наглядее. Вот там мини картинка. И средняя. На среднюю нажимаешь и вылизит на fancybox большой её вариант. Я не знаю какой хтмл код то сунуть? Я его и так сунул. Вот Js
PHP: 
function show_img_middle(img_src){
		$('p.figure').html('<img src="'+img_src+'" alt=""/>');
		}
 
Mr_Max

Mr_Max

Первый класс. Зимние каникулы ^_^
Команда форума
1. Ну а сам фенсибокс то где? =)

2. тебе нужно что-то типа
$(selector_hrre).fancybox();
 
Mr_Max

Mr_Max

Первый класс. Зимние каникулы ^_^
Команда форума
А ну и урл. на большое изображение где? =)
типа <a href="big_image"><img src="medium"></a>
 

proWoke

Новичок
Фенсибокс такой
PHP: 
<script>
$(document).ready(function() {


			$("a#example").fancybox();
});
</script>
вызывается он так :
PHP: 
<a id="example" href="/example/1_b.jpg"><img alt="example1" src="./example/1_s.jpg" /></a>
Так вот я не могу понять как в моём примере передать имя файла в ссылку?

у меня то вставляется в этот блок средняя картинка

PHP: 
<p class="figure"><img src="<?=$data[0]['bigimg']?>" alt="" /></p>
Так по идеи фенси бокс такой должен быть, чтобы большую вызвать:
PHP: 
<a id="example "href="bigimgsrc/idimg.jpg" ><p class="figure"><img src="<?=$data[0]['bigimg']?>" alt="" /></p></a>
И я не могу понять, как мне передать ссылку на большую картинку, те я сделал связанную маленькую и среднюю, а вот как кинуть идентификатор на большую? В моём случае.
 

proWoke

Новичок
После недолгих поисков я так и не понял, как передать путь к файлу через этот jquery attr.
 

proWoke

Новичок
В общем вот к чему я пришёл.

Вот блок, куда вставляется средняя картинка и ссылка на идентификатор большой, которая вызывается при помощи fancybox
PHP: 
<a id="big" href=""><p class="figure"><img src="<?=$data[0]['middleimg']?>" alt="" /></p></a>
Вот код, который вставляет среднюю картинку в этот блок

PHP: 
function show_img_middle(img_src){        //  Показ средней картинки
		$('p.figure').html('<img src="'+img_src+'" alt=""/>');
		}
А вызывается он так:
PHP: 
<a href="#" onclick="show_img_middle('<?=$data[$k]['middleimg']?>')"><img src="<?=$data[$k]['miniimg']?>" alt="" /></a>

А вот код с использованием attr:
PHP: 
$(document).ready(function() {    

  		  $("#big").attr({
       		   href: "DSC01055.JPG",
       			 });
	});
Он просто вставляет во все ссылки фенсибокса ссылку на картинку DSC01055.JPG и при нажатии увеличивает её во всё окно.
Так вот я не могу понять, с помощью чего я могу передать идентификатор в href="". Т.е. там должно быть $data[ID]['bigimg'] по которой я кликнул картинке в её миниварианте.
Это делается средствами PHP или JS? Расскажите, пожалуйста, как это реализовать.
 
craz

craz

Нестандартное звание
proWoke написал(а):
В общем вот к чему я пришёл.

Вот блок, куда вставляется средняя картинка и ссылка на идентификатор большой, которая вызывается при помощи fancybox
PHP: 
<a id="big" href=""><p class="figure"><img src="<?=$data[0]['middleimg']?>" alt="" /></p></a>
Вот код, который вставляет среднюю картинку в этот блок

PHP: 
function show_img_middle(img_src){        //  Показ средней картинки
		$('p.figure').html('<img src="'+img_src+'" alt=""/>');
		}
А вызывается он так:
PHP: 
<a href="#" onclick="show_img_middle('<?=$data[$k]['middleimg']?>')"><img src="<?=$data[$k]['miniimg']?>" alt="" /></a>

А вот код с использованием attr:
PHP: 
$(document).ready(function() {    

  		  $("#big").attr({
       		   href: "DSC01055.JPG",
       			 });
	});
Он просто вставляет во все ссылки фенсибокса ссылку на картинку DSC01055.JPG и при нажатии увеличивает её во всё окно.
Так вот я не могу понять, с помощью чего я могу передать идентификатор в href="". Т.е. там должно быть $data[ID]['bigimg'] по которой я кликнул картинке в её миниварианте.
Это делается средствами PHP или JS? Расскажите, пожалуйста, как это реализовать.
Нажмите для раскрытия...
php
 
Mr_Max

Mr_Max

Первый класс. Зимние каникулы ^_^
Команда форума
proWoke
Короче, делаешь так.

Код: 
jQuery(function(){
  jQuery('a.small_image_selector').click(function(){
    _m = jQuery(this).find('img');
     jQuery('#big').attr('href', _m.attr('big-href'));
     jQuery('#big').find('img').attr('src', _m.attr('med-src'));
     return false;
  });
})
<!--medium image-->
<a id="big" href=""><p class="figure"><img src="" alt="" /></p></a>
<!--/medium image-->

<!--slider-->
<div>
<a href="#" class="small_image_selector"><img src="small_image" med-src="medium_image" big-href="href_here" alt="" /></a>
</div>
<!--/slider-->

ну и подключаешь фансибокс.
$("#big").fancybox();
Как-то так.

Пишу сразу сюда.
Отдебажь сам что-ли
 
Mr_Max

Mr_Max

Первый класс. Зимние каникулы ^_^
Команда форума
^ ^ ^ ^ Updated 23:50 GMT +2

левые атрибуты вешай куда тебе удобнее.
или на <img> или на <a>
 
Mr_Max

Mr_Max

Первый класс. Зимние каникулы ^_^
Команда форума
Ragazzo
Мне жалко своего времени.
ТС уже следующий топик создал с вопросом по джКвери.
Видать чет решыл, что ему готовое будут давать постоянно
 
Войдите или зарегистрируйтесь для ответа.
Сверху