Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.08.2012, 11:54
Интересующийся
Отправить личное сообщение для Madgeniy Посмотреть профиль Найти все сообщения от Madgeniy
 
Регистрация: 01.06.2012
Сообщений: 14

Ссылки внутри другой ссылки
Доброго времени суток!
Пытаюсь реализовать поведение ссылки, когда внутри нее есть еще две ссылки (удобно с точки зрения css).
Так вот.

Такое работает в FF, больше нигде не работает.

<a href="">Alexandr Babko 
<img class="note_img" src = "img/0.png"  width="15" height="12" onClick="location.href='index.html'">
<img class="letter_img" src = "img/0.png"  width="15" height="12" onClick="location.href='index.html'">
</a>


Хочу получить эффект как на прикрепленном рисунке.
Чем можно заменить полученное?
Изображения:
Тип файла: png Без-имени-1.png (18.2 Кб, 4 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 11.08.2012, 12:55
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,479

Впринципе и это можно заставить работать, но не нужно.

Надо как-то так:
<style>
div a{
float:left;
display:block;
width:100%;
background-color:#ddd;
height:24px;
}
div a:hover{
background-color:#ccd;

}

.img{
display:block;
font-size:0;
background-color:transparent !important;
}

.img.note_img{
background-image:url(http://learn.javascript.ru/modules/play/images/export.png);
width:24px;
height:24px;
margin-left:-24px;
}
.img.letter_img{
background-image:url(http://learn.javascript.ru/modules/play/images/readme.png);
margin-left:-50px;
width:24px;
height:24px;
}

</style>

<div>
	<a href="#Babko">Alexandr Babko</a>
	<a href="#note" class="img note_img">Alexandr Babko note</a>
	<a href="#letter" class="img letter_img">Alexandr Babko letter</a>
	<a href="#Babko">Alexandr Babko</a>
	<a href="#note" class="img note_img">Alexandr Babko note</a>
	<a href="#letter" class="img letter_img">Alexandr Babko letter</a>
	<a href="#Babko">Alexandr Babko</a>
	<a href="#note" class="img note_img">Alexandr Babko note</a>
	<a href="#letter" class="img letter_img">Alexandr Babko letter</a>
</div>
__________________
29375, 35

Последний раз редактировалось Aetae, 11.08.2012 в 13:20.
Ответить с цитированием
  #3 (permalink)  
Старый 11.08.2012, 13:02
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Добавьте #
<a href="#">Alexandr Babko
Ответить с цитированием
  #4 (permalink)  
Старый 11.08.2012, 14:43
Интересующийся
Отправить личное сообщение для Madgeniy Посмотреть профиль Найти все сообщения от Madgeniy
 
Регистрация: 01.06.2012
Сообщений: 14

Последний вариант очень понравился, т.к. сохраняется поведение подсветки ссылк при наведении на пикторгаммки. Спасибо. А в чем отличие пустой ссылки от ссылки с якорем?
Ответить с цитированием
  #5 (permalink)  
Старый 11.08.2012, 14:58
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Ну видимо потому, что # используется для переходов внутри страницы, пусто значит "никуда внутри", а без # - на внешние страницы, пусто значит "никуда снаружи".
Это лишь предположение, точно не знаю, если кто знает, подскажет, главное, что обработка идёт так, что эффект получается только в первом случае.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ячейка таблицы - ссылка. Внутри этой ячейки другие ссылки. Alexd jQuery 3 19.04.2012 16:19
Появление ссылки после нажатии на другой ссылки Изучаю_JS Элементы интерфейса 4 17.12.2011 11:10
Загрузить элементы документа с другой страницы alexrussia Events/DOM/Window 10 25.03.2011 10:17
Область видимости внутри функции YISHIMITSY Общие вопросы Javascript 1 25.08.2010 06:50
Как получить текст внутри iframe на другом домене? Alexander Majesty Events/DOM/Window 1 23.12.2009 22:10