Как поменять текст кнопки button
при наведении на нее курсора средствами css
или javascript
?
-
А причем тут текст находящийся в кнопке?– Dimon18 фев 2021 в 9:56
-
на константный текст или он может быть разный? например при наведении всегда чтоб было написано "Купить". Опишите вопрос обширнее– Алексей Шиманский18 фев 2021 в 9:57
-
при наведении будет всегда один и тот же текст– Dimon18 фев 2021 в 9:57
Добавить комментарий
|
2 ответа
Текст будет изменяться при наведении (CSS):
button::before {
content: attr(text);
}
button:hover::before {
content: attr(hover-text);
}
<button text="DEFAULT TEXT" hover-text="NEW TEXT FROM ATTRIBUTE">
</button>
Без использования функции attr()
:
button::before {
content: "DEFAULT TEXT";
}
button:hover::before {
content: "TEXT WHEN HOVER";
}
<button>
</button>
-
3
-
1
-
1@АлексейШиманский я думаю, так удобнее (не надо лезть в разные файлы). Но я могу вернуть его, если Вы считаете, что он необходим :D 18 фев 2021 в 10:10
-
2@ВасяВоронцов думаю стоит, вторым вариантом добавить тоже. Пусть будет 18 фев 2021 в 10:12
Средствами JS. Способов много предложу такой.
btn.addEventListener("mouseover", function() {
this.value = "Updated";
})
btn.addEventListener("mouseout", function() {
this.value = "Old Text";
})
<input id="btn" type="button" value="Old Text">
-
1
-
1