|
|
23.06.2015, 16:32
|
 |
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,123
|
|
|
Сообщение от chernozor
|
|
Тема висит 3 года, никто не удосужился ответить человеку на вопрос.
|
А ты специально зарегился тут, дабы убрать завесу незнания? 
P.S.
Жду тестовый пример, тут. Не по какой-то ссылке на сторонний ресурс...  |
|
23.06.2015, 17:09
|
 |
Профессор
|
|
Регистрация: 30.04.2012
Сообщений: 3,018
|
|
Вот вам тестовый пример без jQuery. 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Документ без названия</title>
<style type="text/css">
.test {
pointer-events: none;
}
.test::after {
background: red;
content: '';
display: block;
height: 100px;
pointer-events: all;
width: 100px;
}
</style>
</head>
<body>
<div class="test">Hello world!</div>
<script type="text/javascript">
document.querySelector('.test').onclick = function() {
alert('Hello world!');
};
</script>
</body>
</html>
|
|
23.06.2015, 17:20
|
 |
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,072
|
|
|
|
|
23.06.2015, 17:43
|
|
Профессор
|
|
Регистрация: 30.04.2012
Сообщений: 3,018
|
|
рони, неужели ими ещё кто-то пользуется? 
|
|
24.06.2015, 08:31
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,123
|
|
|
Сообщение от Ruslan_xDD
|
|
Вот вам тестовый пример без jQuery.
|
Не совсем понял в чем тут смысл... Ты вешаешь событие на элемент, а не на псевдоэлемент. И в обработчике тот элемент получаешь...
Т.ч. пока ничего нового.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
<link rel="stylesheet/less" type="text/css" href="style.less">
<script src="http://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.0/less.min.js"></script>
-->
<style type='text/css'>
.test {
pointer-events: none;
}
.test::after {
background: red;
content: '';
display: block;
height: 100px;
pointer-events: all;
width: 100px;
}
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<div class="test">Hello world!</div>
<script type="text/javascript">
document.querySelector('.test').onclick = function(e) {
alert(e.target.tagName);
};
</script>
</body>
</html>
|
|
24.06.2015, 08:33
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,123
|
|
Аналогичный пример уже был продемонстрирован в самом начале.
Событие на :after
Там же и дан ответ на вопрос темы.
Пока никаких опровергающих примеров я не видел. |
|
24.06.2015, 14:50
|
|
Профессор
|
|
Регистрация: 30.04.2012
Сообщений: 3,018
|
|
|
ksa, ну больше никак не получится сделать, только так.
|
|
24.06.2015, 15:09
|
|
что-то знаю
|
|
Регистрация: 24.05.2009
Сообщений: 5,176
|
|
|
Сообщение от ksa
|
|
Ты вешаешь событие на элемент, а не на псевдоэлемент.
|
Согласен, при этом лишается возможность прослушивать события у основного элемента (что не есть гуд).
Увы и ах, но pointer-events не является решением.
PS. Ссыль я удалил. |
|
25.06.2015, 01:30
|
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
|
Сообщение от Gesandte
|
|
Собственно и весь вопрос, можно как то повесить событие на данный селектор или нет?
|
По идее, расчет позиции эл-та(и курсора) и отслеживание события на области
Внештатные решения типично требуют кода больше, чем дополнения через скрипт новых элементов, покрывающих нужные старые.
Последний раз редактировалось Deff, 25.06.2015 в 01:34.
|
|
28.06.2015, 15:54
|
|
Аспирант
|
|
Регистрация: 15.05.2015
Сообщений: 41
|
|
так можно,только тут не определишь был ли это клик по :before или :after
<style>
div {
color: green;
border: 1px green dashed;
position: absolute;
}
div:after {
content:"Ы";
width: 100px;
height: 100px;
border: 2px gray solid;
padding: 5px;
font-size: 20px;
position: absolute;
top: 30px;
left: 30px;
}
</style>
<div id="divcheg">дивчег</div>
<script>
divcheg.onclick = function(e) {
if ((e.offsetX > this.offsetWidth) || (e.offsetY > this.offsetHeight)) {
alert(e.type + ' on pseudo element');
} else {
alert(e.type + ' on ' + e.target.tagName)
}
};
</script>
Последний раз редактировалось Endy, 28.06.2015 в 18:33.
|
|
|
|
на всякий для ie < 9 пролетает.
