Показать сообщение отдельно
  #1 (permalink)  
Старый 08.12.2013, 20:06
Новичок на форуме
Отправить личное сообщение для Icepeek Посмотреть профиль Найти все сообщения от Icepeek
 
Регистрация: 08.12.2013
Сообщений: 5

jQuery выборка в массив
Добрый вечер. Имеем: код html
<div class="videoContainer">
		<div class="previewImg">
			<img src="mov/preview/gp.jpg" alt="Garry_Potter" />
		</div>
		<div class="wigetVideo">
			<div class="titleView">
				Гарри Поттер и Дары смерти (часть 1)
			</div>
			<div class="timeView">
			1:42:00
			</div>
			<div class="videoButton">
				<div class="descriptionButton descriptionColor">
					<img src="img/comment.png" alt="comment_button" width="30px" class="commentPic" />
				</div>
				<div class="playButton playColor">
					<img src="img/play.png" alt="play_button" width="30px" />
				</div>
				<div class="profileButton profileColor">
					<img src="img/profile.png" alt="profile_button" width="30px" />
				</div>
			</div>
		</div>	
			<div class="descriptionView">
				<p>Гарри, Рон и Гермиона отправляются в рискованное путешествие, 
				ведь им предстоит выполнить важную миссию: 
				найти и уничтожить тайные источники бессмертия и могущества Волан-де-Морта — Крестражи. 
				</p>
			</div>
	</div>

Таких блоков будет много, в них будут меняться следующие блоки: <div class="previewImg"> , <div class="titleView">, <div class="timeView">, <div class="descriptionView"> Блоки выстраиваются по float. Как сделать, чтобы по щелчку на блоке <div class="descriptionButton"> выводилось только нужное описание <div class="descriptionView">, а не все сразу? Пример jQuery кода с подсчетом координат, чтобы всплывающая подсказка выводилась в видимой области экрана (еще не дописан):
$(document).ready(function () {
$('.descriptionView').hide();
$('.descriptionButton').click(function() {
	var ttLeft,
		    ttTop,
			$this=$('.wigetVideo'),
			$tip=$('.descriptionView'),
		    triggerPos = $this.offset(),
		    triggerH = $this.outerHeight(),
		    triggerW = $this.outerWidth(),
			tipW = $tip.outerWidth(),
		    tipH = $tip.outerHeight(),
		    screenW = $(window).width(),
			screenH = $(window).height(),
			scrollTop = $(document).scrollTop();
		
		if (screenH - triggerPos.top - tipH - triggerH - scrollTop > 0 ) {
			ttTop = triggerPos.top + triggerH;
			ttLeft = triggerPos.left-10;
				
		} else {
			ttTop = triggerPos.top-10;
			ttLeft = triggerPos.left + triggerW;
		}

		
		$tip
		   .css({
			left : ttLeft ,
			top : ttTop,
			position:"absolute"			
		    }).fadeIn(100);
			
	});// end click
	$('.descriptionButton').mouseout(function() {
		$('.descriptionView').fadeOut(100);
	});
	
	
});//end ready


Я полагаю нужен массив. При ответе, представьте, что мне три года =)
Ответить с цитированием