Avatar billede hnteknik Novice
22. marts 2005 - 16:24 Der er 4 kommentarer og
1 løsning

Online visning af valgt font, farve og størrelse samt baggrund

Jeg har en lidt uhandy admin side, hvor man kan sætte font, fontstr, farve og baggrundfarve for forskellige elementer på sider som senere kan kaldes frem fra en database.

jeg og brugerne vill gerne have en 'her og nu' visning af, hvad pokker der er valgt. Hvordan ser det ud med et eksempel på en tekst visning.
Jeg havde tænkt noget opdtering med innterHTML, men er der nogen, der kan vise mig hen på et godt eksempel ?

Henrik
Avatar billede olebole Juniormester
22. marts 2005 - 17:01 #1
<ole>

Ja, på hvad? Hvad skal der ske - og hvornår?

/mvh
</bole>
Avatar billede hnteknik Novice
22. marts 2005 - 17:10 #2
>>Olebole - Bruger vælger en font, size, forecolor backcolor etc. Hvordan kommer det tila t se ud, inen jeg gemmer det.
Værdierne tages fra inputfelter - noget ala dette: ska lige have det fra inputfelter

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript"><!--
function changeText(newText){
document.getElementById("test").innerHTML=newText
document.getElementById("test").srcMode = 1;
document.getElementById("test").style.fontFamily = "monospace";
document.getElementById("test").style.fontSize = "12pt";
document.getElementById("test").style.color = "red";
//document.getElementById("test").style.bgcolor = "blue";
}
//-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<body>
<p>Nedenfor ses noget volapyk , <a href='java script:changeText("hej Eksperten!<br>Du kan bruge <b>enhver</b> type af html med dette script!")'>Klik p&aring; dette link</a> og se og teksten kan &aelig;ndres!<br>
  <br>
<div id="test">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. </div>
</body>
</html>
Avatar billede hnteknik Novice
22. marts 2005 - 17:12 #3
Sådan noget må være lavet før - måske under JAvascript delen
Avatar billede hnteknik Novice
22. marts 2005 - 17:14 #4
Ups den udkomenterede skulle være:

document.getElementById("test").style.backgroundColor = '#c0c0c0';
Avatar billede hnteknik Novice
22. marts 2005 - 19:09 #5
Lavede selv en løsning:'

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript"><!--
function changeText(divx,newText){
document.getElementById(divx).innerHTML=newText
document.getElementById(divx).srcMode = 1;
document.getElementById(divx).style.fontFamily = document.getElementById("baseFont").value; //"monospace";
document.getElementById(divx).style.fontSize = document.getElementById("titleSize").value +"pt" ;//"12pt";
document.getElementById(divx).style.color = document.getElementById("titleColor").value ;//"blue";
document.getElementById(divx).style.backgroundColor =document.getElementById("backgroundColor").value ; //'#c0c0c0';
}
//-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<body>
<hr noshade color="#C0C0C0" size="2">
    <table border="0" cellpadding="0" cellspacing="0" class="normal">
        <tr valign="top">
            <td width="200" align="left" class="normalBold-Big"><strong>
              Udseende
            </strong></td>
            <td width="144" class="normalBold">
                <strong>Font</strong><br />
                <input type="text" name="baseFont" value="arial">
          </td>
          <td width="148" align="left" class="normalBold">
                <strong>Baggrundsfarve</strong><br />
                <input type="text" name="backgroundColor" value="#FFFFFF">                   
            </td>
          <td width="227" rowspan="2" align="left" class="normalBold"><div id="test">
            <DIV id=test
style="FONT-SIZE: 12pt; COLOR: #000000; FONT-FAMILY: arial; BACKGROUND-COLOR: #ffffff"
srcMode="1">hej Eksperten!<BR>
              Du kan bruge <B>enhver</B> type af html med dette script!</DIV>
          </div></td>
        </tr>
        <tr valign="top">
            <td height="41"><a href='java script:changeText("test","hej Eksperten!<br>Du kan bruge <b>enhver</b> type af html med dette script!")'>Klik p&aring; dette link</a>        
            </td>
            <td class="normalBold">
                <strong>Titelstørrelse</strong><br />
                <input type="text" name="titleSize" value="5">
          </td>
            <td align="left" class="normalBold">
                <strong>Titelfarve</strong><br />
                <input type="text" name="titleColor" value="#000000">
          </td>
        </tr>
    </table>
    <hr noshade color="#C0C0C0" size="2">
</body>
</html>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Seneste spørgsmål Seneste aktivitet
I går 10:21 Ny printer, men hvilken Af mort1 i Printere
13/0819:41 USB på Linux Af Uvanga i Linux
12/0818:26 Hvilken type mus Af mort1 i PC
11/0813:21 ms Forms Af leahcim i Andet software
10/0821:30 Blokeret på Snapchat? Af LineP i Chat & Messaging