6 svar · 300 visningar · startad av Hamatzu
Hej hej !
Som ni kan se på denna hemsida så kan man få en bakgrundsfärg på valfri text.
https://www.webdesignskolan.com/css/css.htm#headtextbakgrund
Så min fråga är. Kan man få någon onmouseover/onmouseout effekt på detta. Så att bakgrundsfärgen på texten bara kommer fram när man håller musen över.
M.V.H
Hamatzu
med css:
<html>
<head>
<style type="text/css">
p:hover {background-color:red;}
</style>
</head>
<body>
<p>text</p>
</body>
</html>
IE stödjer inte detta.
Eftersom frågan är ställd i JavaScript-forumet förmodar jag ett en JavaScript-lösning är ok:
<script type="text/javascript">
String.prototype.trim = function(){
return this.replace(/^\s+|\s+$/, "");
}
function addClass(obj, classStr){
if(obj.className=="")
obj.className = classStr;
else
obj.className += " "+classStr;
}
function removeClass(obj, classStr){
if((new RegExp(classStr)).test(obj.className))
obj.className = obj.className.replace(classStr, "").trim();
}
window.onload = function() {
var pElms = document.getElementsByTagName("p");
for(var i=0; i<pElms.length; i++) {
pElms[i].onmouseover = function(){ addClass(this, 'hover'); }
pElms[i].onmouseout = function(){ removeClass(this, 'hover'); }
}
}
</script>
<style type="text/css">
p.hover { background: #ccc; }
</style>
Kan man ändra storleken på bakgrundsfärgen på texten ????
:q
Hamatzu skrev:
Kan man ändra storleken på bakgrundsfärgen på texten ????
:q
Du kan nog inte ändra storleken på bakgrunden, men storleken på texten borde väl fungera.
<style type="text/css">
p.hover {
background: #ccc;
font-size: 1em;
}
</style>
Tack för hjälpen alla :birp
