webForumDet fria alternativet

position relative

HTML & CSS

8 svar · 421 visningar · startad av Mattias Nordin

Medlem sedan dec. 20051 056 inlägg
Frågan#1

Jag vill åstakomma:

style="position:relative; top:10px; left:0px; "

fast med en följande syntax i ett javascript...

document.getElementById(x).style.color = 'red';
[B]document.getElementById(x).style.right = '50px';[/B]

Kan inte finna rätt syntax när jag letar. Tacksam för hjälp.

:stud

Medlem sedan juni 200032 967 inlägg
#2

Det finns inget som heter right. Använd left och utgå från fönstrets vänsterkant. Men, är det inte ett absolutpositionerat element du vill ha?

Medlem sedan dec. 20051 056 inlägg
#3

God morgon @nders :)

Det jag labbar med är om det går att få ett textstycke att flytta sig några pixlar uppåt när en funktion anropas i ett javascript. Jag byter även textfärgen med "document.getElementById(x).style.color = 'red';" och det fungerar så jag hade hoppats på att det skulle gå att använda sig av något liknande "position:relative" för att flytta texten.

<script>
....
function funHeadMouseOut(x){
	if((varSelectedHeadTabsString.indexOf(x)) < 0){ //Testar om x namnet finns i strängen över valda bilder. Skippa om true.
	document.getElementById(x).style.backgroundImage = 'url('+tab_out.src+')';
	document.getElementById(x).style.color = 'red';
	document.getElementById("tab1Text").style.right = '50px';
	}
}
</script>

	<!--- 1 --->
	<span onClick="document.location.href='/web07/tab1/havsbrus.asp'">
	<td id="tab_1" background="/web07/_design/tab_0.gif" onMouseOver="funHeadMouseOver(this.id);"  onMouseOut="funHeadMouseOut(this.id);" class="headMenyDesign">
	<span id="tab1Text">About me</span>
	</td>
	</span>

Det är alltså en tabell som har en bakgrundsbild som ändras vid mouse over. Tabellen används som ett menysystem där det är enkelt att byta text på flikarna.

Medlem sedan juni 200032 967 inlägg
#4

Morgon? :o

Jag hade försökt med något sånt härnt (utan att veta då förstås):

document.getElementById("tab1Text").style.left = document.getElementById("tab1Text").style.left + 50 + 'px';

Sen kanske du får problem att flytta en <td>, men det är en annan historia.

Medlem sedan dec. 20051 056 inlägg
#5

Går det att byta från class="headMenyDesign" till class="headMenyDesign2" på ett object med javascript?

Jag är verkligen inte så kunnig på javascript / css.

Medlem sedan dec. 20051 056 inlägg
#6

@nders skrev:

Sen kanske du får problem att flytta en <td>, men det är en annan historia.

Jo det tror jag också men det går väl att lägga en ny <div> runt bara texten så det hoppas jag kunna gå runt.

Är lite för trött från gårdagen. Provade stadens nattliv ;)

Medlem sedan juni 200032 967 inlägg
#7

Går det att byta från class="headMenyDesign" till class="headMenyDesign2" på ett object med javascript?

Jodå.

document.getElementById('mittelement').className='foo';
Medlem sedan dec. 20051 056 inlägg
#8

Det underlättar ju mycket... vad trevligt. Ibland blir man bara glad.

Det vi pratade om tidigare verkar fungera om man tidigare angett positionen.

<span id="tab1Text" STYLE="position:relative;left:0px">Menytext</span>

<script>
document.getElementById("tab1Text").style.top= '5px';
</script>

Som alltid @nders, du rockar fett ;) (fasen vad trött jag är... :r )

Medlem sedan juni 200032 967 inlägg
#9

Kul att du fick ihop det! :)

263 ms totalt · 4 externa anrop · v20260731065814-full.1dc6f849
132 ms — deklarationer (db)
0 ms — hämta statistik (cache)
128 ms — hämta tråd, inlägg och bilagor (db)
121 ms — ändringar (db)