• Страница 1 из 1
  • 1
Модератор форума: Yuri_G  
Сообщество uCoz » Мастерская uCoz » Дизайн: управление шаблонами » Вложение одного тега в другой (Помогите найти решение с тегом img)
Вложение одного тега в другой
Freeskate
Сообщений: 11
Репутация: 0

Сообщение # 1 | 16:31:24
Добрый день. Ребят, может кто сталкивался с такой же проблемой, только в другом контексте.

Решил я добавить к всем своим ссылкам, открывающимся в новом окне, приклеить значок окошка. Сделал это через свойство Background.

Код
a [target="_blank"]{padding-right:14px;background: url(/img/bg/nw.gif) no-repeat;background-position: right 1px top 1px;}
a[target="_blank"]:hover{border-bottom:1px dotted #157acc;}

Получилось очень здорово, всё работает, но есть проблема, состоящая в том, что в тег <a> заключается тег <img>. Теперь все ссылки имеют окошко рядом и все ИЗОБРАЖЕНИЯ имеют такое окошко (правый нижний угол).



Как от этого можно избавиться? Всю голову сломал. По сути требуется решение следующего условия:

Код
<если(<а> имеет внутри себя тег <img> )>background: url(...)
<иначе>padding-right:14px;background: url(/img/bg/nw.gif) no-repeat;background-position: right 1px top 1px;
<конец условия>

Условие должно быть в CSS. Самое логичное, что получилось придумать это сделать следующее:

Код
a img {background: url();}

Но данное решение не работает так как убирает background за самой картинкой, а не за background'ом тега A.
Кто нибудь здесь разбирается в таком? =) У меня уже больше срабатывает спортивный интерес =)

Zatok.Net - Работа и заработок в сети Интернет
bandjuk
Сообщений: 6816
Репутация: 2398
Уровень замечаний:

Сообщение # 2 | 17:40:27
Freeskate, вряд ли через ксс что-то выйдет
Сообщение отредактировал bandjuk - Среда, 05 Фев 2014, 18:17:54
Drinko
Сообщений: 909
Репутация: 773

Сообщение # 3 | 18:24:00
Freeskate, только JS, через CSS никак не получится.

Head-Mad
Сообщений: 378
Репутация: 129

Сообщение # 4 | 18:35:26
Вообще, я как-то сталкивался с подобной ситуацией, и понял что в CSS не хватает селектора родительского элемента (подобно дочернему). проблему можно решить несколькими путями.
Вставить внутрь ссылки span, и стиль применять к нему. А соответственно картинки должны быть без тега span (и стили к ним применяться не будут).
Другой вариант- короткий скрипт, подобного плана
Код
<script>$('[target="_blank"]').has('img').css('background','none');</script>

Можешь забрать этот код и вставить его себе, сам знаешь куда.
bandjuk
Сообщений: 6816
Репутация: 2398
Уровень замечаний:

Сообщение # 5 | 22:12:32
Цитата Head-Mad ()
Вставить внутрь ссылки span

тогда уж проще к ссылке класс прописать
Freeskate
Сообщений: 11
Репутация: 0

Сообщение # 6 | 22:56:30
Цитата Head-Mad ()
Вставить внутрь ссылки span

Тогда придётся прописывать span ВСЕМ ссылкам на сайте. Представь какой это геморой... Как вариант, но не подходит. Я знаю кстати ещё один выход. Но он может некорректно отображать само окошко.

Варик, который 100% работает. Нужно в конце каждой такой ссылки ставить 2-3 пробела (зависит от шрифта), затем убираем из свойств padding-left. Получается если пробелы не ставим, то картинка(окошко) будет висеть над последней буквой нашей ссылки. Для всех ссылок с img внутри себя окошко тоже будет отображаться, но его не будет видно, так - как background тега img накрывает собой background тега a.

Код
a [target="_blank"]{background: url(/img/bg/nw.gif) no-repeat;background-position: right 0px top 0px;}

Мне кажется, что должно быть всё таки решение. Каким то образом же люди ставят себе такие окошки рядом с ссылками типа _blank. Вряд ли они юзают javascript.

Zatok.Net - Работа и заработок в сети Интернет
Сообщество uCoz » Мастерская uCoz » Дизайн: управление шаблонами » Вложение одного тега в другой (Помогите найти решение с тегом img)
  • Страница 1 из 1
  • 1
Поиск: