12 svar · 415 visningar · startad av MickeA.com
Hej
Som standarted på en tabell har jkag ingen border alls.
Cellerna funkar som länkar, att när jag trycker på en viss cell, kommer jag till en ny sida.
Nu vill jag ha ngt som gör att border-color blir röd vid onMouseOver.
Vid on MouseOut ska bordern försvinna helt och hållet.
Antar att jag får lösa detta m.h.a Javasript, men hur som helst behöver jag hjälp ;)
<td onmouseover="this.style.border = 'red solid 1px';" onmouseout="this.style.border = ''">grr</td>
Tack så mkt, ska testa ;)
Dino skrev:
<td>style="border: 1px;" onmouseover="this.style.border = 'red solid 1px';" onmouseout="this.style.border = ''">grr</td>
Annars ändras ju storleken sedan.
Jag la till style="border: 1px;"
Sedan vadå?
red//hann inte se din redigering. :) Gör som Nickemannen säger.
Dino skrev:
Sedan vadå?
Om inte den har 1px i border innan man har tagit musen över td:n så förstoras ju td:n med 1 px och det ser ju lite fel ut.
/red :D
Nä, min kod:
<html>
<head>
<title>Main</title>
<link rel="stylesheet" href="style.css" type="text/css">
<script type="text/javascript" src="nosecondmouse.js"></script>
</head>
<body class='main'>
<table class='portfolio'>
<tr>
<td colspan='3'>This is my Portfolio, the sites I've made and some other stuff.<br>To visit a site, simply click on the image or the description.</td>
</tr>
<tr><td colspan='3' height='20'><hr></td></tr>
<tr class='portfolio'>
<td onMouseOver="window.status='Click To Visit Pordran.se'; return true;" onMouseOut="window.status=''; return true;" onclick="window.open('http://www.Pordran.se')" class='portfolio' align='left' width='33%'><img src='pics/portfolio/pordran.png'></td>
<td onMouseOver="window.status='Click To Visit HissenAB.se'; return true;" onMouseOut="window.status=''; return true;" onclick="window.open('http://www.HissenAB.se')" class='portfolio' align='center' width='33%'><img src='pics/portfolio/hissen.png'></td>
<td onMouseOver="window.status='Click To Visit Eff Sverige AB'; return true;" onMouseOut="window.status=''; return true;" onclick="window.open('http://www.mickea.com/projekt/eff/')" class='portfolio' align='right' width='33%'><img src='pics/portfolio/eff.png'></td>
</tr>
<tr><td colspan='3' height='20'><hr></td></tr>
<tr class='portfolio'>
<td onMouseOver="window.status='Click To Visit Herrklubben.se'; return true;" onMouseOut="window.status=''; return true;" onclick="window.open('http://www.Herrklubben.se')" class='portfolio' align='left' width='33%'><img src='pics/portfolio/herrklubben.png'></td>
<td class='portfolio' align='center' width='33%' style="cursor: default;"></td>
<td class='portfolio' align='right' width='33%' style="cursor: default;"></td>
</tr>
</table>
</body>
</html>
Det funkar inte, hur ska jag lägga till detta när jag redan har ngt vid onMouseOver / MouseOut??
Kan ngn hjälpa mig att trycka in koden för att ändra färg på bordern i det här:
<td onMouseOver="window.status='Click To Visit Pordran.se'; return true;" onMouseOut="window.status=''; return true;" onclick="window.open('http://www.Pordran.se')" class='portfolio' align='left' width='33%'><img src='pics/portfolio/pordran.png'></td>
Det funkade på en annan cell, där jag inte har ngn bild, men i de andra funkade det inte....
<script language="JavaScript">
function over(text, e){
e.style.border = "red solid 1px";
window.status = text;
}
function out(e){
e.style.border = "";
window.status = '';
}
</script>
...
<td style="border-width: 1px;" onMouseOver="over('Click To Visit Pordran.se',this)" onMouseOut="out(this)" onclick="window.open('http://www.Pordran.se')">grr</td>
Tack, ska prova ;)
Jo, det funkar, men ser helt knäpp ut, för i början får jag en grå border runt, sen när ajg håller över så blir den röd, så långt så rätt.
Men sen när jag tar bort musen från cellen, då förvinner bordern helt och hållet, vilket resulterar i att 'hela sidan' flyttar på sig.
Själva grejjen med detta är ju att jag vill till en början inte ha ngn border alls, när jag håller över ska den bli röd och sen ska den försvinna, men bildena ska ju inte flyttas en pixel åt sidan, det ser helt knäppt ut...
Byt ut det i fetstil till den backgroundsfärg du har så det smälter in.
function over(text, e){
e.style.border = "red solid 1px";
window.status = text;
}
function out(e){
e.style.border = "[b]white[/b] solid 1px";
window.status = '';
}
...
<td style="border: 1px solid [b]white[/b];" onMouseOver="over('Click To Visit Pordran.se',this)" onMouseOut="out(this)" onclick="window.open('http://www.Pordran.se')">grr</td>
Det jobbiga är att jag har en bild som bakgrund, en gradient mellan mörk / ljusblått, så det funkar nog inte så bra, visserligen kan jag ta en färg som smälter in i bakgrunden, men porovade att bara sätta border runt varje bild istället, det blir ju samma sak, att det flyttar på sig, antar att det inte finns ngn osynlig färg ;))
Nu skiter jag i det här, gjorde en 'habrovink'.
Men tack för scriptet Dino, det sparas till senare tillfälle ;)