Ссылка с пустого div с бэкграундом-картинкой

[z1a2r]

Вопрос тривиальный, но загнал в тупик.

Возникла задачка - с любой картинки на сайте (кроме тех, что относятся к оформлению) яваскриптом делать всплывающий кусочек текста ака easyTooltip.

Верстка сайта - шапка, тело из двух колонок (в одном из столбцов - меню) и футер.

Вложенность элементов в рабочей колонке разная, поэтому в скрипте есть смысл обращаться сразу ко всем img. Для этого все картинки оформления нужно перевести в div-ы c бэкграундами. на некоторых из картинок были навешаны ссылки (например, на логотип в шапке). Обычный рецепт в этом случае - вставить в div прозрачный единичный gif 1x1 и растянуть его до нужных размеров, в данном случае не годится, т.к. снова появится тег img. Если вешать ссылку на растянутый до нужных размеров div (пустой или с   ) - будет ли соблюдаться валидность? И не возникнет ли проблем с кроссбраузерностью?

[wildhind]

Обычный рецепт в этом случае - вставить в div прозрачный единичный gif 1x1 и растянуть его до нужных размеров

это чушь какая-то.

Отправляйте лесом того, у кого такое за обычные рецепты считается.

И ваша задача, как мне кажется, должна решаться куда более прямым способом. Не опишите ли её полностью?

[z1a2r]

спасибо за отклик.

задача - добавить easyTooltip "всплывашки" на любую картинку в колонке с контентом:

<script type="text/javascript">
	$(document).ready(function(){	
		$("img").easyTooltip({
			content: '<h4>Some title</h4><p>Lorem ipsum dolor sit amet, <strong>consectetur</strong> adipiscing elit. Mauris placerat.</p>'
		});
	});
</script>

соответственно, в остальных блоках верстки такого эффекта быть не должно.

у "рабочей" колонки есть свой класс и свой id, но img внутри нее могут быть завернуты в разное количество тегов. хотя, наверное, (#id_рабочей_колонки img) должно сработать.

Отправляйте лесом того, у кого такое за обычные рецепты считается.

и вопрос на будущее - а как обычно в таких случаях поступают?

[br3t]

(#id_рабочей_колонки img) должно сработать.

Так попробуйте

Другое дело - не совсем понятно, зачем на всех картинках одинаковый тултип

[z1a2r]

получилось. смущала огромная вложенность.

одинаковый тултип в пример попал, а так при пустом контенте js-ка title привзявывает, в тайтл вставляется описание картинки, а оно в свою очередь заполняется через админку.

Edited March 27, 2012 by z1a2r

[wildhind]

у "рабочей" колонки есть свой класс и свой id, но img внутри нее могут быть завернуты в разное количество тегов. хотя, наверное, (#id_рабочей_колонки img) должно сработать.

Именно так и сработает.

jQuery использует практически те же селекторы, которые применяются в css. На таком уровне сложности оговоркой «почти» можно даже пренебречь.

и вопрос на будущее - а как обычно в таких случаях поступают?

фоновые картинки просто ставятся фоном тем элементам, которым они нужны как фон.

А все эти однопиксельные пустые картинки… ну может когда-то давно они кому-то нужны были. Вроде NN4 чем-то таким грешил.

[z1a2r]

значит, устаревший рецепт попался)