[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: показ скрытого блока на jquery
Lenarfate
подскажите кто-нить, как реализовать "поделиться ссылкой", как тут http://digg.com/ (кнопочка share под каждым постом)? интересует всплывающий блок. не могу привязать ни к id ни к class. не работает


$(function(){
$('.share').click(function(){
$('div.block').show();
});
});




Спустя 1 час, 9 минут, 35 секунд (2.07.2010 - 12:50) danilin2010 написал(а):
во превых функцию надо объявлять так.
$(document).ready(function(){
$('.share').click(function(){
$('div.block').show();
});
});

Во вторых твой код приведет к тому, что при клике на любой
элемент с слассом share (в том числе и на элементы внутри него)
будут отображены все элементы Div с классом block.

Но может тебе это и надо я не знаю.

Спустя 4 минуты, 13 секунд (2.07.2010 - 12:54) danilin2010 написал(а):
и вобще идем например сюда
http://jquery-docs.ru
там есть ответы на все вопросы
и спрашивать никого не надо

Спустя 36 минут, 52 секунды (2.07.2010 - 13:31) Lenarfate написал(а):
и вообще ни фига не работает

Спустя 17 минут, 41 секунда (2.07.2010 - 13:49) Michael написал(а):
А там никакой не click, а mouseover.

Спустя 5 минут, 23 секунды (2.07.2010 - 13:54) Lenarfate написал(а):
да не в этом суть.ссылки выводятся циклом. если без цикла, то все работает, но ,естественно, открывает сразу все блоки

Спустя 3 минуты, 50 секунд (2.07.2010 - 13:58) danilin2010 написал(а):
цикл покажи

Спустя 6 минут, 6 секунд (2.07.2010 - 14:04) Lenarfate написал(а):

$(xml).find('news').each(function(){
news += '<a class="share" href="#" onclick="return false">share</a>';
news += '<div class="block" style="display:none;">';
});


вот кусок

Спустя 6 минут, 42 секунды (2.07.2010 - 14:11) danilin2010 написал(а):
javascript-ом ссылки добавляш?
тода $('.share').click надо вызывать не в конструкции
$(document).ready, а после добавления
ссылок к дому

Спустя 1 минута, 31 секунда (2.07.2010 - 14:12) Lenarfate написал(а):
все равно также

Спустя 10 минут, 40 секунд (2.07.2010 - 14:23) danilin2010 написал(а):
покажи код тогда может будет понятно в чем проблема

Спустя 4 минуты, 47 секунд (2.07.2010 - 14:28) Lenarfate написал(а):

<!-- get news begin -->
<
script type="text/javascript">
$(document).ready(function(){
$.ajax({
type : 'post',
url : 'lib.php',
dataType : 'xml',
success : function(xml){
var news = '';

$(xml).find('news').each(function(){
news += '<div class="one_news"><table><tr><td><div class="news_photo">';
news += '<span style="display:none" id="id">' + $(this).find('id').text() + '</span>';
news += '<img src="uploads/' + $(this).find('image').text() + '" id="img" width="20%" /></div>';
news += '</td><td width="150%"><p class="news_head">';
news += '<a href="' + $(this).find('adress').text() + '">';
news += $(this).find('subject').text() + '</a> ';
news += '(' + $(this).find('date').text() + ')</p>';
news += $(this).find('text').text();
news += '<div class="news_bottom"><img src="image/comment.jpg" />';
news += '<a href="">3 comments</a><img src="image/share.jpg" /><a class="share" href="#" onclick="return false">share</a>';
news += '<div class="block" style="display:none;">';
news += '<a rel="nofollow" target="_blank" href="http://twitter.com/home?status=RT @artinblogru ' + $(this).find('subject').text() + ': ' + $(this).find('adress').text() + '" title="Добавить в Twitter"><img src="buttons/twit_cir.png" border="0" title="Опубликовать в Twitter" alt="Опубликовать в Twitter" /></a>';
news += '<a rel="nofollow" target="blank" href="http://www.facebook.com/sharer.php?u=' + $(this).find('adress').text() + '"><img src="buttons/face_cir.png" border="0" title="Написать в Facebook" alt="Написать в Facebook" /></a>';
news += '<a rel="nofollow" target="_blank" href="http://www.livejournal.com/update.bml?event=' + $(this).find('adress').text() + '&subject=' + $(this).find('subject').text() + '" ><img src="buttons/lj_cir.png" border="0"title="Записать себе в LiveJournal" alt="Записать себе в LiveJournal" /></a>';
news += '<a rel="nofollow" target="_blank" href="http://connect.mail.ru/share?share_url=' + $(this).find('adress').text() + '" ><img src="buttons/mir_cir.png" border="0" title="Показать В Моем Мире" alt="Показать В Моем Мире" /></a>';
news += '</div>';
news += '<img src="image/bury.jpg" /><a href="bury.tpl?height=70%&width=70%" class="thickbox">bury</a></div></td>';
news += '<td align="right"><input type="image" name="delete" src="image/del.png" class="del_news" />';
news += '<div class="news_icon"><img src="image/icon_news.png" />';
news += '</div></td></tr></table></div>';
});

$("div.news").html(news);
}
}
);

$(".share").mouseover(function(){
$(".block").show('fast');
});
});
</
script>
<!--
get news end -->

Спустя 11 минут, 13 секунд (2.07.2010 - 14:39) danilin2010 написал(а):
вот эта конструкция

$(".share").mouseover(function(){
$(".block").show('fast');
});


выполняется в момент загрузки документа

так же как и обращение к серверу через аякс

а функция которая обрабатывает результаты запроса
выполняется уже после получения результата аякс

т.е. момент инициализации mouseover
никаких ссылок а доме нету

так что перенеси (".share").mouseover
внутрь function(xml)
сразу после
$("div.news").html(news);

Спустя 8 минут (2.07.2010 - 14:47) Lenarfate написал(а):
ага)спасибо) а как теперь заставить открываться только нужный блок?)а не все сразу

Спустя 9 минут, 9 секунд (2.07.2010 - 14:56) danilin2010 написал(а):
А как ты определиш какой нужный?
Если это просто следующий за ссылкой то можно, например, так :
$(".share").mouseover(function(){
$(this).next(".block").show('fast');
});


Спустя 1 минута, 42 секунды (2.07.2010 - 14:58) Lenarfate написал(а):
спасибо, выручил biggrin.gif

Спустя 4 минуты, 35 секунд (2.07.2010 - 15:02) Lenarfate написал(а):
еще, а если делать не next ? то есть этот блок, по сути, не следующий? есть альтернативный вариант?

Спустя 4 минуты, 35 секунд (2.07.2010 - 15:07) danilin2010 написал(а):
сформулируй как этот блок соотносится со ссылкой

Спустя 59 секунд (2.07.2010 - 15:08) Lenarfate написал(а):
ну для каждой новости, выводимой в цикле, своя ссылка и блок

Спустя 4 минуты, 17 секунд (2.07.2010 - 15:12) danilin2010 написал(а):
У них есть общий родитель?

Спустя 1 минута, 12 секунд (2.07.2010 - 15:13) Lenarfate написал(а):
разве что тег <news>, получаемый из xml

Спустя 11 минут, 18 секунд (2.07.2010 - 15:25) danilin2010 написал(а):
ну вот я вижу
                news += '<div class="news_bottom"><img src="image/comment.jpg" />';
news += '<a href="">3 comments</a><img src="image/share.jpg" /><a class="share" href="#" onclick="return false">share</a>';
news += '<div class="block" style="display:none;">';
news += '<a rel="nofollow" target="_blank" href="http://twitter.com/home?status=RT @artinblogru ' + $(this).find('subject').text() + ': ' + $(this).find('adress').text() + '" title="Добавить в Twitter"><img src="buttons/twit_cir.png" border="0" title="Опубликовать в Twitter" alt="Опубликовать в Twitter" /></a>';
news += '<a rel="nofollow" target="blank" href="http://www.facebook.com/sharer.php?u=' + $(this).find('adress').text() + '"><img src="buttons/face_cir.png" border="0" title="Написать в Facebook" alt="Написать в Facebook" /></a>';
news += '<a rel="nofollow" target="_blank" href="http://www.livejournal.com/update.bml?event=' + $(this).find('adress').text() + '&subject=' + $(this).find('subject').text() + '" ><img src="buttons/lj_cir.png" border="0"title="Записать себе в LiveJournal" alt="Записать себе в LiveJournal" /></a>';
news += '<a rel="nofollow" target="_blank" href="http://connect.mail.ru/share?share_url=' + $(this).find('adress').text() + '" ><img src="buttons/mir_cir.png" border="0" title="Показать В Моем Мире" alt="Показать В Моем Мире" /></a>';
news += '</div>';
news += '<img src="image/bury.jpg" /><a href="bury.tpl?height=70%&width=70%" class="thickbox">bury</a></div>


из этого куска можно видеть, что
и ссылка и блок вложены в див с классом news_bottom
но дело не в классе а в том, что этот див родитель для обоих объектов

и если так у тебя будет всегда, то можно попробовать следующее
$(".share").mouseover(function(){
$(this).parent().children(".block").show('fast');
});

или даже
$(".share").mouseover(function(){
$(this).parent(".news_bottom").children(".block").show('fast');
});

Спустя 2 дня, 18 часов, 38 минут, 55 секунд (5.07.2010 - 10:03) Lenarfate написал(а):
это все отлично. но вот когда я навожу мышку на ссылки внутри блока, он закрывается. как этого избежать??
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2025 Invision Power Services, Inc.