---
title: "Se \"Live\" vad som har ändrat"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/166767-se-live-vad-som-har-ändrat"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "SGuncel"
published: "2007-11-28T13:21:44.000Z"
updated: "2007-11-30T11:13:21.000Z"
replies: 12
views: 604
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/166767-se-live-vad-som-har-ändrat"
---

# Se "Live" vad som har ändrat

## #1 — SGuncel, 2007-11-28T13:21Z

Jag vill att man ska se hur sin chattema har blivit innan man sparar så jag kan inte mycket om javascript.

Typ när man väljer bakgrundsfärgen grön och text färgen röd så ska allt ändras på tabellen hur gör man det?

Det jag gjorde nu på koden med Id nåt där alla färger står. Det var bara test, skulle testa min fram men det gick inte så bra.

***Ursäkta för att jag dubbel posta. Annars var tråden för lång.***

Permalänk: https://www.webforum.nu/p/166767

## #2 — SGuncel, 2007-11-28T13:22Z

Färger:

```
<select class="selectchattheme" name="chatthemecolorbackground" onchange="document.getElementById('ThemeColorBack').style='background-color:'+this[this.selectedIndex].value+';'">
							<option value="">
								(färg)
							</option><option value="Black">
								Black
							</option><option value="Navy">
								Navy
							</option><option value="DarkBlue">
								DarkBlue
							</option><option value="MediumBlue">
								MediumBlue
							</option><option value="Blue">
								Blue
							</option><option value="DarkGreen">
								DarkGreen
							</option><option value="Green">
								Green
							</option><option value="Teal">
								Teal
							</option><option value="DarkCyan">
								DarkCyan
							</option><option value="DeepSkyBlue">
								DeepSkyBlue
							</option><option value="DarkTurquoise">
								DarkTurquoise
							</option><option value="MediumSpringGreen">
								MediumSpringGreen
							</option><option value="Lime">
								Lime
							</option><option value="SpringGreen">
								SpringGreen
							</option><option value="Aqua">
								Aqua
							</option><option value="Cyan">
								Cyan
							</option><option value="MidnightBlue">
								MidnightBlue
							</option><option value="DodgerBlue">
								DodgerBlue
							</option><option value="LightSeaGreen">
								LightSeaGreen
							</option><option value="ForestGreen">
								ForestGreen
							</option><option value="SeaGreen">
								SeaGreen
							</option><option value="DarkSlateGray">
								DarkSlateGray
							</option><option value="LimeGreen">
								LimeGreen
							</option><option value="MediumSeaGreen">
								MediumSeaGreen
							</option><option value="Turquoise">
								Turquoise
							</option><option value="RoyalBlue">
								RoyalBlue
							</option><option value="SteelBlue">
								SteelBlue
							</option><option value="DarkSlateBlue">
								DarkSlateBlue
							</option><option value="MediumTurquoise">
								MediumTurquoise
							</option><option value="Indigo">
								Indigo
							</option><option value="DarkOliveGreen">
								DarkOliveGreen
							</option><option value="CadetBlue">
								CadetBlue
							</option><option value="CornflowerBlue">
								CornflowerBlue
							</option><option value="MediumAquamarine">
								MediumAquamarine
							</option><option value="DimGray">
								DimGray
							</option><option value="SlateBlue">
								SlateBlue
							</option><option value="OliveDrab">
								OliveDrab
							</option><option value="SlateGray">
								SlateGray
							</option><option value="LightSlateGray">
								LightSlateGray
							</option><option value="MediumSlateBlue">
								MediumSlateBlue
							</option><option value="LawnGreen">
								LawnGreen
							</option><option value="Chartreuse">
								Chartreuse
							</option><option value="Aquamarine">
								Aquamarine
							</option><option value="Maroon">
								Maroon
							</option><option value="Purple">
								Purple
							</option><option value="Olive">
								Olive
							</option><option value="Gray">
								Gray
							</option><option value="SkyBlue">
								SkyBlue
							</option><option value="LightSkyBlue">
								LightSkyBlue
							</option><option value="BlueViolet">
								BlueViolet
							</option><option value="DarkRed">
								DarkRed
							</option><option value="DarkMagenta">
								DarkMagenta
							</option><option value="SaddleBrown">
								SaddleBrown
							</option><option value="DarkSeaGreen">
								DarkSeaGreen
							</option><option value="LightGreen">
								LightGreen
							</option><option value="MediumPurple">
								MediumPurple
							</option><option value="DarkViolet">
								DarkViolet
							</option><option value="PaleGreen">
								PaleGreen
							</option><option value="DarkOrchid">
								DarkOrchid
							</option><option value="YellowGreen">
								YellowGreen
							</option><option value="Sienna">
								Sienna
							</option><option value="Brown">
								Brown
							</option><option value="DarkGray">
								DarkGray
							</option><option value="LightBlue">
								LightBlue
							</option><option value="GreenYellow">
								GreenYellow
							</option><option value="PaleTurquoise">
								PaleTurquoise
							</option><option value="LightSteelBlue">
								LightSteelBlue
							</option><option value="PowderBlue">
								PowderBlue
							</option><option value="Firebrick">
								Firebrick
							</option><option value="DarkGoldenrod">
								DarkGoldenrod
							</option><option value="MediumOrchid">
								MediumOrchid
							</option><option value="RosyBrown">
								RosyBrown
							</option><option value="DarkKhaki">
								DarkKhaki
							</option><option value="Silver">
								Silver
							</option><option value="MediumVioletRed">
								MediumVioletRed
							</option><option value="IndianRed">
								IndianRed
							</option><option value="Peru">
								Peru
							</option><option value="Chocolate">
								Chocolate
							</option><option value="Tan">
								Tan
							</option><option value="LightGrey">
								LightGrey
							</option><option value="Thistle">
								Thistle
							</option><option value="Orchid">
								Orchid
							</option><option value="Goldenrod">
								Goldenrod
							</option><option value="PaleVioletRed">
								PaleVioletRed
							</option><option value="Crimson">
								Crimson
							</option><option value="Gainsboro">
								Gainsboro
							</option><option value="Plum">
								Plum
							</option><option value="BurlyWood">
								BurlyWood
							</option><option value="LightCyan">
								LightCyan
							</option><option value="Lavender">
								Lavender
							</option><option value="DarkSalmon">
								DarkSalmon
							</option><option value="Violet">
								Violet
							</option><option value="PaleGoldenrod">
								PaleGoldenrod
							</option><option value="LightCoral">
								LightCoral
							</option><option value="Khaki">
								Khaki
							</option><option value="AliceBlue">
								AliceBlue
							</option><option value="Honeydew">
								Honeydew
							</option><option value="Azure">
								Azure
							</option><option value="SandyBrown">
								SandyBrown
							</option><option value="Wheat">
								Wheat
							</option><option value="Beige">
								Beige
							</option><option value="WhiteSmoke">
								WhiteSmoke
							</option><option value="MintCream">
								MintCream
							</option><option value="GhostWhite">
								GhostWhite
							</option><option value="Salmon">
								Salmon
							</option><option value="AntiqueWhite">
								AntiqueWhite
							</option><option value="Linen">
								Linen
							</option><option value="LightGoldenrodYellow">
								LightGoldenrodYellow
							</option><option value="OldLace">
								OldLace
							</option><option value="Red">
								Red
							</option><option value="Fuchsia">
								Fuchsia
							</option><option value="Magenta">
								Magenta
							</option><option value="DeepPink">
								DeepPink
							</option><option value="OrangeRed">
								OrangeRed
							</option><option value="Tomato">
								Tomato
							</option><option value="HotPink">
								HotPink
							</option><option value="Coral">
								Coral
							</option><option value="DarkOrange">
								DarkOrange
							</option><option value="LightSalmon">
								LightSalmon
							</option><option value="Orange">
								Orange
							</option><option value="LightPink">
								LightPink
							</option><option value="Pink">
								Pink
							</option><option value="Gold">
								Gold
							</option><option value="PeachPuff">
								PeachPuff
							</option><option value="NavajoWhite">
								NavajoWhite
							</option><option value="Moccasin">
								Moccasin
							</option><option value="Bisque">
								Bisque
							</option><option value="MistyRose">
								MistyRose
							</option><option value="BlanchedAlmond">
								BlanchedAlmond
							</option><option value="PapayaWhip">
								PapayaWhip
							</option><option value="LavenderBlush">
								LavenderBlush
							</option><option value="SeaShell">
								SeaShell
							</option><option value="Cornsilk">
								Cornsilk
							</option><option value="LemonChiffon">
								LemonChiffon
							</option><option value="FloralWhite">
								FloralWhite
							</option><option value="Snow">
								Snow
							</option><option value="Yellow">
								Yellow
							</option><option value="LightYellow">
								LightYellow
							</option><option value="Ivory">
								Ivory
							</option><option value="White">
								White
							</option>
							</select>
```

Permalänk: https://www.webforum.nu/p/2054506

## #3 — SGuncel, 2007-11-28T13:22Z

Html koden (tabellen):

```
<table width="100%"  border="0" cellspacing="0" cellpadding="0" height="71" id="ThemeColorBack" background="<%=ObjRS("Background")%>">
	<tr>
		<td width="58" height="71" style="padding: 3px;" valign="top">
			<img src="../_Grafik/Pix.gif" width="3" height="20">	
			<img src="../ingenbild.gif">
			<td>
				<table width="100%"  border="0" cellspacing="0" cellpadding="0" height="14">
					<tr>
						<td width="981" height="14" valign="top" style="padding: 3px;">
							<a href="../profile.asp?usrId=<%=Server.HtmlEncode(Session("UsrID"))%>"><%=Server.HtmlEncode(Session("UsrTLAlias"))%></a>&nbsp; 
							|&nbsp; <strong>23:23 den 27 november 2007</strong>                    
						</td>
			</td>
                	</tr>
                </table>
                
              <table width="100%"  border="0" cellspacing="0" cellpadding="0" height="56">
                <tr>
                  <td width="259" height="56" valign="top" style="padding: 3px;">
                	test meddelande
                  </td>
                </tr>
              </table>
		</td>
	</tr>
</table>
```

Permalänk: https://www.webforum.nu/p/2054508

## #4 — voigtann1, 2007-11-28T14:02Z

```
<script type="text/javascript" language="JavaScript">
function changeColor(color)
{
	document.getElementById("ThemeColorBack").bgColor = color;
}
</script>
```

```
<select class="selectchattheme" name="chatthemecolorbackground" onchange="changeColor(this[this.selectedIndex].value);">
```

Permalänk: https://www.webforum.nu/p/2054517

## #5 — SGuncel, 2007-11-28T15:28Z

Hur gör t.ex. om jag vill ändra:
meddelande text färgen, storlek och font..
 Dinns det någon sida där man kan läsa hur man gör? :)

Permalänk: https://www.webforum.nu/p/2054528

## #6 — voigtann1, 2007-11-28T15:33Z

googla?

```
function changeTextColor(color){
	document.getElementById("ThemeColorBack").style.color = color;
}
```

för text färgen.

Permalänk: https://www.webforum.nu/p/2054529

## #7 — SGuncel, 2007-11-28T15:55Z

Jo, men vad ska man typ googla?

Permalänk: https://www.webforum.nu/p/2054536

## #8 — voigtann1, 2007-11-28T15:58Z

Sök efter "Javascript change font size" kanske? 
"Javascript tutorial change styles" mm..

Permalänk: https://www.webforum.nu/p/2054539

## #9 — SGuncel, 2007-11-29T08:08Z

Kan man inte ha så här:

```
<td width="259" height="56" valign="top" style="padding: 3px;" id="ThemeMessageFontSize ThemeMessageFontColor ThemeColorBack">
```

Så här ser Javascript koden ut:

```
 <script LANGUAGE="JavaScript" TYPE="text/javascript">
function changeColor(color)
{
	document.getElementById("ThemeColorBack").bgColor = color;
}

function changeTextColor(color){
	document.getElementById("ThemeMessageFontColor").style.color = color;
} [B]Här är rad 52[/B]

function changeTextSize(size) {
	document.getElementById('ThemeMessageFontSize').style.fontSize = size;
}
</script>
```

Får fel när jag försöker ha tre funktion på en cell.
Bakgrunds färg kan jag ändra, men när jag ska ändra färgen och storleken på texten får jag fel. Fel meddelande: Line 52 Object required

Permalänk: https://www.webforum.nu/p/2054676

## #10 — The_Hulk, 2007-11-29T08:17Z

Du kan inte ha flera ID på samma html-tagg.

```
<td width="259" height="56" valign="top" style="padding: 3px;" id="ThemeMessageFontSize">
```

Låter som du inte riktigt har förstått vad ID-taggen är till för. Den används för att sätta ett ID på en html-tagg så man kan leta upp en specifik html-tagg i html-dokumentet.

```
 <script LANGUAGE="JavaScript" TYPE="text/javascript">
function changeColor(color)
{
	document.getElementById("ThemeMessageFontSize").bgColor = color;
}

function changeTextColor(color){
	document.getElementById("ThemeMessageFontSize").style.color = color;
}

function changeTextSize(size) {
	document.getElementById('ThemeMessageFontSize').style.fontSize = size;
}
</script>
```

Permalänk: https://www.webforum.nu/p/2054677

## #11 — SGuncel, 2007-11-29T20:33Z

Tackar för allt lösning. Men har något annat fråga.

```
<input type="text" name="ThemeMessageImageBack" class="inputchattheme" onchange="changeBgImage(this[this.selectedIndex].value);">
```

När man skriver in länk ska det ändras till bakgrund. Hur gör man det? Såg att det inte var samma som select :)

Permalänk: https://www.webforum.nu/p/2054861

## #12 — The_Hulk, 2007-11-30T10:02Z

> **SGuncel skrev:**
>
> Tackar för allt lösning. Men har något annat fråga.
>
>
> ```
> <input type="text" name="ThemeMessageImageBack" class="inputchattheme" onchange="changeBgImage(this[this.selectedIndex].value);">
> ```
>
> 
> 
> När man skriver in länk ska det ändras till bakgrund. Hur gör man det? Såg att det inte var samma som select :)

```
<input type="text" name="ThemeMessageImageBack" class="inputchattheme" onchange="changeBgImage(this.value);">
```

Nu vet jag inte vad funktionen **changeBgImage** gör eller vilka parametrar den ska ta emot. Vill du ha ut värdet av textboxen använder du this.value

Permalänk: https://www.webforum.nu/p/2054928

## #13 — SGuncel, 2007-11-30T11:13Z

Den gör så att man kan ha eget bakgrund. Man ska klistra in länken där.

Permalänk: https://www.webforum.nu/p/2054939

---

Tråden på webben: https://www.webforum.nu/amne/javascript/166767-se-live-vad-som-har-ändrat
