Søg
Avatar billede nilshog Nybegynder
13. januar 2004 - 09:47 Der er 6 kommentarer

Justering af indhold i div

Hej jeg har en div med CMS indhold i... Her kan man juster indhold ved brug af justeringsknapperne "vestre"; "center"; "højre".. Når man klikker på dem sker følgende:

//Ændrer justeringen for hele dokumentet
function juster(j) {

  document.all.editor.style.textAlign = j;
  justering = j;
  document.all.editor.focus();

}

Dette juster hele sidens indhold, hvordan får jeg den kun til at juster det markeret
Avatar billede nute Nybegynder
13. januar 2004 - 11:21 #1
tjaeh ... du kunne jo gøre noget ála dette:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
    <title>Untitled</title>
    <script language="JavaScript" type="text/javascript">
    <!--
    function alignDiv( strStyle )
    {
          document.getElementById( 'myDiv' ).className = strStyle + 'Align';
    }
    //-->
    </script>
    <style>
        #myDiv
        {
            width:200px;
            height:200px;
            border:1px solid black;
            font-family:verdana;
            font-size:10px;
        }
        .leftAlign
        {
            text-align:left;
        }
        .centerAlign
        {
            text-align:center;
        }
        .rightAlign
        {
            text-align:right;
        }
    </style>
</head>

<body>
<div id="myDiv" class="">Dette er en lang tekst<br>eller ... den kunne nok have været<br>meget længre, men jeg gidder ikke at skrive mere</div>
<input type="button" value="align left" onclick="alignDiv('left');"><input type="button" value="align center" onclick="alignDiv('center');"><input type="button" value="align right" onclick="alignDiv('right');">
</body>
</html>

/nute
Avatar billede nilshog Nybegynder
13. januar 2004 - 11:36 #2
Den justerer jo hele indholdet.. Den skal kun justerer det selected indhold
Avatar billede nute Nybegynder
13. januar 2004 - 13:38 #3
ahh ... øv ... den lille del af dit spørgsmål så jeg ikke :-(

dette er måske noget af det du kigger efter:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
    <title>Untitled</title>
    <script language="JavaScript" type="text/javascript">
    <!--
    function alignDiv( strStyle )
    {
        var objRange = document.selection.createRange();
        objRange.execCommand( strStyle );
    }
    //-->
    </script>
</head>

<body>
<p id="para"/>
<div id="myDiv" style="border:1px solid black;"><p>Dette er en lang tekst</p><p>eller ... den kunne nok have været</p><p>meget længre, men jeg gidder ikke at skrive mere</p></div>
<div id="mySecondDiv" style="border:1px solid black;">Dette er også en lang tekst<br>men den er ikke "formatteret" på <br>nogen anden måde end kun med linebreaks, <br> og al teks her vil blive justeret</div>
<input type="button" value="align left" onclick="alignDiv('JustifyLeft');"><input type="button" value="align center" onclick="alignDiv('JustifyCenter');"><input type="button" value="align right" onclick="alignDiv('JustifyRight');">
</body>
</html>


Problemet er at denne funktionalitet krever at den markerede tekst ligger i et HTML tag for sig selv. hvis du prøver at markere en linje ( eller et ord) i den første "boks", så vil du se at den linje du har markeret, eller den linje som dit markerede ord befinder sig på, vil justere sig. Hvis du derimod markerer et ord eller linje i den nederste "boks", så vil du se at hele indholdet justerer sig ... dette er fordi funktionaliteten betragter hele indholdet som en enhed ...

/nute
Avatar billede Slettet bruger
13. januar 2004 - 18:12 #4
function juster(j) {
  document.all.editor.focus();
  document.selection.createRange().execCommand("Justify" + j);
  document.all.editor.focus();
}

Kaldes med:

<a href="#" onclick="return false;" onmousedown="juster('Left');">Venstre</a>
<a href="#" onclick="return false;" onmousedown="juster('Right');">Højre</a>
<a href="#" onclick="return false;" onmousedown="juster('Center');">Centrér</a>
Avatar billede Slettet bruger
13. januar 2004 - 18:12 #5
http://msdn.microsoft.com/workshop/author/dhtml/reference/commandids.asp?frame=true
Avatar billede nute Nybegynder
13. januar 2004 - 19:47 #6
phoenixv >> hvad er så lige den store forskel på det jeg har postet, og det du har postet, andet end at du sætter focus før og efter ?
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 15:14 Sætte billeder ind i google sheets ark ud fra elev nummer Af lurup i Excel
16/0822:58 Kan man undgå at få vist referer når der klikkes på links Af Strawberry i Browsere
16/0812:21 Er det svindel eller fra Microsoft Af mort1 i Andet sikkerhed
15/0811:56 Er det muligt at lave sin egen webserver i boligforening? Af Strawberry i Cloudtjenester
14/0810:21 Ny printer, men hvilken Af mort1 i Printere
White papers
Flere white papers »