Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.02.2011, 15:08
Аватар для mav1
Аспирант
Отправить личное сообщение для mav1 Посмотреть профиль Найти все сообщения от mav1
 
Регистрация: 30.08.2010
Сообщений: 57

Закрытие прозрачного div при щелчке мыши в любой его области
Доброго времени суток всем.

Проблемка такая. Есть прозрачный div. В нем непрозрачный текст со ссылками, или допустим непрозрачная картинка являющаяся ссылкой (банер). Также есть кнопка закрыть в углу, которая закрывает прозрачный div. Вопрос такой - как изменить существующий и приведённый ниже код, чтобы div закрывался не только при щелчке по "закрыть" (крестику в верхнем правом углу), но и просто при щелчке в любой области diva - по банеру например, который я туда вставлю? То есть чтобы и окно новое открылось (ссылка с банера), и div закрылся.

код:

<DIV id="mouselayer" align="center" style="z-index:100;left: 50%;height:220px;weight:220px;position:absolute;border:0px solid #333;background-color:transparent">
<DIV id="mouselayer" align="center" style="text-align:right">
<A href="#" onClick="fr.location.href='about:blank';if (document.getElementById) { document.getElementById('mouselayer').style.visibility='hidden'; } else if (document.all) { document.all['mouselayer'].style.visibility='hidden'; } else if (document.layers) { document.layers['mouselayer'].visibility='hide'; };return(false);" 
style="font-size:12px;font-weight:bold;border:none;padding:0 13px" title="закрыть">&times;</A>
</DIV>
<br><br><br>
<p style="font-size:16px;padding:33px;TEXT-ALIGN:justify"><a href="http://google.ru">ссылка</a></p>
<IFRAME src="" name="fr" height="0" width="0" marginwidth="0" marginheight="0" border="0" frameborder="0" scrolling="no"></IFRAME>
</DIV>
Ответить с цитированием
  #2 (permalink)  
Старый 09.02.2011, 15:14
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

<div style="border: 1px solid; width: 100px; height: 100px;" onclick="this.style.display = 'none';"></div>
Ответить с цитированием
  #3 (permalink)  
Старый 09.02.2011, 15:25
Аватар для mav1
Аспирант
Отправить личное сообщение для mav1 Посмотреть профиль Найти все сообщения от mav1
 
Регистрация: 30.08.2010
Сообщений: 57

Спасибо, вы подсказали правильно и ваш пример работает, но видимо есть какая то тонкость, которая не дает правильно работать onclick="this.style.display = 'none'; в моем примере. Не могли бы вы подсказать, как правильно вставить этот обработчик мышиного клика? Как видите, у меня тут два дива - как только ни пробовал, не получается чтобы работало корректно(
Ответить с цитированием
  #4 (permalink)  
Старый 09.02.2011, 15:29
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,228

Сообщение от mav1
как только ни пробовал
Покажи как пробовал...
Ответить с цитированием
  #5 (permalink)  
Старый 09.02.2011, 15:50
Аватар для mav1
Аспирант
Отправить личное сообщение для mav1 Посмотреть профиль Найти все сообщения от mav1
 
Регистрация: 30.08.2010
Сообщений: 57

ну например :

<DIV id="mouselayer" align="center" style="z-index:100;left: 50%;height:220px;weight:220px;position:absolute;border:0px solid #333;background-color:transparent" onclick="this.style.display = 'none';" >
<DIV id="mouselayer" align="center" style="text-align:right" >
<A href="#" onClick="fr.location.href='about:blank';if (document.getElementById) { document.getElementById('mouselayer').style.visibility='hidden'; } else if (document.all) { document.all['mouselayer'].style.visibility='hidden'; } else if (document.layers) { document.layers['mouselayer'].visibility='hide'; };return(false);" 
style="font-size:12px;font-weight:bold;border:none;padding:0 13px" title="закрыть">&times;</A>
</DIV>
<br><br><br>
<p style="font-size:16px;padding:33px;TEXT-ALIGN:justify"><a target="_blank" href="http://google.ru">ссылка</a></p>
<IFRAME src="" name="fr" height="0" width="0" marginwidth="0" marginheight="0" border="0" frameborder="0" scrolling="no"></IFRAME>
</DIV>
Ответить с цитированием
  #6 (permalink)  
Старый 09.02.2011, 15:59
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,228

mav1, если таки закрыть тот див как положено - все убирается...

<!doctype html>
<html>
<head>
<style type="text/css">
</style>
<script>
</script>
</head>
<body>
<DIV id="mouselayer" align="center" style="z-index:100;left: 50%;height:220px;weight:220px;position:absolute;border:0px solid #333;background-color:orange;" onclick="this.style.display = 'none';">
    <DIV id="mouselayer" align="center" style="text-align:right">
        <A href="#" onClick="fr.location.href='about:blank';if (document.getElementById) { document.getElementById('mouselayer').style.visibility='hidden'; } else if (document.all) { document.all['mouselayer'].style.visibility='hidden'; } else if (document.layers) { document.layers['mouselayer'].visibility='hide'; };return(false);"
        style="font-size:12px;font-weight:bold;border:none;padding:0 13px" title="закрыть">&times;</A>
        </DIV>
        <br><br><br>
        <p style="font-size:16px;padding:33px;TEXT-ALIGN:justify"><a target="_blank" href="http://google.ru">ссылка</a>
        </p>
        <IFRAME src="" name="fr" height="0" width="0" marginwidth="0" marginheight="0"
        border="0" frameborder="0" scrolling="no">
        </IFRAME>
    </DIV>
</DIV>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 09.02.2011, 16:08
Аватар для mav1
Аспирант
Отправить личное сообщение для mav1 Посмотреть профиль Найти все сообщения от mav1
 
Регистрация: 30.08.2010
Сообщений: 57

Спасибо, друзья. Уже не первый раз получаю помощь на этом форуме! Плюсую вас, дай Бог вам здравия.
Ответить с цитированием
  #8 (permalink)  
Старый 09.02.2011, 16:39
Аватар для ksa
ksa ksa на форуме
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,228

mav1, пиши теги прописными буквами...
Ответить с цитированием
  #9 (permalink)  
Старый 09.02.2011, 19:25
х.з
Посмотреть профиль Найти все сообщения от dmitriymar
 
Регистрация: 21.11.2010
Сообщений: 4,588

monolithed,
кста -мучался с подобным-на полностью прозрачном события не срабатывали привязанные к нему. пока его прозрачность не делал отличной от 100%.и непонятно почему так..
в фф

Последний раз редактировалось dmitriymar, 09.02.2011 в 21:30.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
При клике ссылки, открыть DIV блок, и при клике ещё раз, закрыть его Simon Общие вопросы Javascript 59 28.05.2017 17:31
Закрытие всплывающего слоя при щелчке Jason Bourne Общие вопросы Javascript 1 14.01.2011 09:17
FireFox: onmouseover не работает при зажатой кнопке мыши no. Общие вопросы Javascript 4 19.08.2008 13:43