Доброго времени суток, помогите решить проблему. Нужно после клика на первый блок средствами явы прилепить ему стилизованную подсказку(прописана в стиле). Чтобы подсказки не накладывались (стилизованная и браузерная стандартная), атрибут title не подойдет. Как видно со вторым блоком, можно назвать подсказку например DATAtitle и тогда браузер свою стандартную не дублирует.
Но возникает вопрос: как присвоить блоку тот же самый DATAtitle через яваскрипт(после клика по блоку например)?
И второй вопрос, пока у блока нет стилизованной подсказки, при наведении вылезает пустота, обведенная параметром border из стиля, как сделать чтобы он не выводился если подсказка пустая?
Спасибо всем кто чем поможет, посоветует.
<script>
function set_tittle(e){
e.title = 'Ахалай-махалай!'
}
</script>
<body>
<style type="text/css">
.div_title:hover::after
{content: attr(title);border: 1px solid red;position: absolute;width:200px;top: 30%;z-index: 1;background: rgba(255,255,230,0.9);left: 20%;
}
.div_DATAtitle:hover::after
{content: attr(DATAtitle);border: 1px solid #333;position: absolute;width:200px;top: 30%;z-index: 1;background: rgba(255,255,230,0.9);left: 20%;
}
</style>
<div class = "div_title" style="max-width: 150px; border:1px solid blue; cursor:pointer; display:inline-block" onclick="set_tittle(this)">Прилепить подсказку</div>
<div class = "div_DATAtitle" DATAtitle='Подсказка класса DATAtitle. Т.к стандартного атрибута title нет, то и нет стандартной подсказки браузера' style="border:1px solid blue; cursor:pointer; display:inline-block; margin-left: 5px">DATAtitle</div>