first-letter ändern mit javascript

Treverer

Grand Admiral Special
Mitglied seit
23.07.2001
Beiträge
3.211
Renomée
107
Standort
Trier
  • SIMAP Race
  • QMC Race
hi!

ich komme nicht weiter *suspect*


ich ändere nach dem laden einer html datei in laufzeit mit

destinationColumnIn.firstChild.style.textIndent='0px';

den css-style eines absatzes, damit diese zeile nicht eingerückt wird.

das klappt!!!

folgendes dagegen nicht:

destinationColumnIn.firstChild.style.firstLetter='normal';

ist leider eben auch 'nur' ein pseudo-element; gibt daher anscheinend keine "direkte" css-eigenschaft, die dann per javascript ansprechbar wäre.

hat jemand eine idee?

p.s.: die class per javascript zu ändern funktionert zwar, ändert aber nichts daran, das das die vorherige defintion des pseudoelements ( p:first-letter{font-size: larger;} ) bestehen bleibt :[
 
Pseudo-Elemente können meines Wissens im DOM nicht adressiert werden.

Was aber geht: Stylesheet-Regeln adressieren und ändern.

In IE mit:
document.styleSheets[index].rules[index]

In Mozilla mit:
document.styleSheets[index].cssRules[index]

Viel Erfolg!
 
Pseudo-Elemente können meines Wissens im DOM nicht adressiert werden.

Was aber geht: Stylesheet-Regeln adressieren und ändern.

In IE mit:
document.styleSheets[index].rules[index]

In Mozilla mit:
document.styleSheets[index].cssRules[index]

Viel Erfolg!


vielen dank! nur: woher zauber ich den richtigen index? *noahnung*

mist, warum ist dieses #*&%-teil auch nur pseudo-element )((
 
Ich habe das hier im Netz gefunden und leicht angepasst....Es baut auf der Lösung von Antarctica auf, kümmert sich aber um den Index...

-Demo hier-

Ich hoffe, es ist schnell genug, für deine Zwecke...

lg
Felix
 
Ich habe das hier im Netz gefunden und leicht angepasst....Es baut auf der Lösung von Antarctica auf, kümmert sich aber um den Index...

-Demo hier-

Ich hoffe, es ist schnell genug, für deine Zwecke...

lg
Felix

vielen dank erneut für das bemühen und den link. geht natürlich erneut um die column sache...

iund alles, was ich eigentlich nicht mehr habe bei dem script ist zeit :] ich habe jetzt auch keine ahnung, wie lange dein beispielscript in meinem beispiel bräuchte. doch vor allem: es sollen ja nicht(!) jede erste zeile jedes absatzes geändert werden, sondern ganz konkret nur bestimmte absätze. eben jene absätze, die gesplittet werden und wo der zweite teil eben in einer neuen spalte fort gesetzt wird. sowas ist dann ja kein wirklich neuer absatz (welcher in der ersten zeile eingerückt und im ersten buchstaben hervorgehoben ist).

dummerweise, ach nein: glücklicherweise!, läuft es nun aber doch mit dem ersetzen des classname, im css:

p {
margin-top: 3px;
font-size:1em;
text-indent: 0.5em;
}

p:first-letter{
font-size: larger;
}

p.p2 {
text-indent: 0px;
}

p.p2:first-letter{
font-size: 1em;
}

im javascript wird "<p>absatz-text</p>"ohne classname schlicht erweitert auf "<p class='p2'>absatz-text</p>":

destinationColumnIn.firstChild.className='p2';

läuft! :D so einfach kann es sein, wenn man (=ich) endlich den shit mit vererbung und kaskadieren richtig verstehen würde *suspect* trotzdem vielen dank für eure beiträge!!! das xy.fistChild beinhaltet eben den zweiten teil des kompletten absatzes, der erste ist weiterhin und korregt mit "<p> formartiert



der visuelle effekt ist übrigens enorm, da die neuen absätze nun viel leichter erkennbar sind und zugleich deutlich ist, wo ein absatz nur die fortsetzung des vorherigen ist. bei textwüsten und textspalten unerläßlich...


***

um kein neuen thread zu eröffnen:

ich hätte da ein interessantes neues detail-problem, man ist ja nie zufrieden :]
nicht, daß ich da (mal wieder ;) ) von dir eine lösung wünsche, sondern nur des austausches wegen:

die letzte zeile eines absatzes wird nie als blocksatz, sondern immer linksbündig (standard) dargestellt. gestern noch gelesen, daß es für den ie eine text-align einstellung gibt, welche eben alle zeile betrifft. ist aber uninteressant (habs daher auch schon vergessen), wenn dies eben nur beim ie so ist. außerdem denke ich nicht, daß er unterscheidet, ob denn das letzte zeichen ein satzendezeichen ist ("!","?","."), denn wäre linksbündig ja absolut richtig.

ich brauche also eine stretch-routine für diese eine zeile. haben sich, wenn man so googelt, manche mit rumgeplagt.

meine derzeitigen überlegungen gehen nun in die richtung, "an den richtigen stellen" zusätzliche spaces einzufügen. was viel zeit kostet, da jedesmal zu testen ist, ob ein neuer zeilenumbruch entstand (=ein space zuviel -> also rückgängig und fertig dann der absatz). schwierig aber auch die suche nach den richtigen stellen (immer zwischen letztem word und ersten wort der letzten zeile): es läßt sich ja nicht feststellen, mit welchem wort die letzte zeile beginnt. muß ich nochmals ne nacht drüber schlafen...

und was mein ziel ja auch noch ist: fußnoten auf der seite anzeigen, wo sie vorkommen. das wird noch lustig *buck*
 
Zuletzt bearbeitet:
Dein Problem ist, dass du mit HTML etwas machen willst, für das HTML eigentlich nicht geschaffen ist. Kleiner Tipp: Schau dir mal PDF an ;-)
 
es sollen ja nicht(!) jede erste zeile jedes absatzes geändert werden, sondern ganz konkret nur bestimmte absätze. eben jene absätze, die gesplittet werden und wo der zweite teil eben in einer neuen spalte fort gesetzt wird.
(..)
***

um kein neuen thread zu eröffnen:

ich hätte da ein interessantes neues detail-problem, man ist ja nie zufrieden :]
nicht, daß ich da (mal wieder ;) ) von dir eine lösung wünsche, sondern nur des austausches wegen:

die letzte zeile eines absatzes wird nie als blocksatz, sondern immer linksbündig (standard) dargestellt. gestern noch gelesen, daß es für den ie eine text-align einstellung gibt, welche eben alle zeile betrifft. ist aber uninteressant (habs daher auch schon vergessen), wenn dies eben nur beim ie so ist. außerdem denke ich nicht, daß er unterscheidet, ob denn das letzte zeichen ein satzendezeichen ist ("!","?","."), denn wäre linksbündig ja absolut richtig.

ich brauche also eine stretch-routine für diese eine zeile. haben sich, wenn man so googelt, manche mit rumgeplagt.

meine derzeitigen überlegungen gehen nun in die richtung, "an den richtigen stellen" zusätzliche spaces einzufügen. was viel zeit kostet, da jedesmal zu testen ist, ob ein neuer zeilenumbruch entstand (=ein space zuviel -> also rückgängig und fertig dann der absatz). schwierig aber auch die suche nach den richtigen stellen (immer zwischen letztem word und ersten wort der letzten zeile): es läßt sich ja nicht feststellen, mit welchem wort die letzte zeile beginnt. muß ich nochmals ne nacht drüber schlafen...

und was mein ziel ja auch noch ist: fußnoten auf der seite anzeigen, wo sie vorkommen. das wird noch lustig *buck*

Oh.. :) das erste Problem habe ich falsch verstanden :) Aber Hauptsache du hast ne Lösung gefunden...

Zu dem "stretching"-Problem: Da wüsste ich momentan auch keine gescheite Lösung... Aber sieht es denn nicht eh besser aus, wenn der Blocksatz auf der letzten Zeile nicht mehr angewendet wird? Das machen doch die Layouter in den meisten Fällen auch so... z.B. bei Zeitschriften oder Zeitungen...Und wenn dann einmal nur drei kurze Worte auftauchen, werden sie ja extrem auseinander gezogen, was imo ned so gut aussieht, oder?
 
So wie ich das verstanden hab, benutzt er <p> nicht als Absatz, wie von HTML vorgesehen, sondern für eine gewisse Menge Text. Mehrere <p> ergeben zusammen einen Absatz. D.h. manchmal soll er die letzte Zeile austreiben, weil der logische Absatz noch weitergeht, manchmal soll er es nicht, weil der logische Absatz nicht mehr weitergeht.

Also Dinge, für die HTML eigentlich gar nicht gedacht und gemacht ist.

Ich hab auch noch nicht verstanden, warum und wieso. Hat wohl irgendwas mit dem Spaltenlayout zu tun!? Nur warum er HTML-Dokumente für A4-Seiten benutzen will ("Fußnoten auf der gleichen Seite")... das macht einfach keinen Sinn IMO.

Mir egal, ich lass euch euren Spaß...
 
Ja du hast natürlich schon recht. HTML ist dafür nicht gedacht und selbst mit CSS zu limitiert. Daran wird wohl auch CSS3 nicht viel ändern und bis das erstmal überall implementiert ist ;)
Weshalb so eine Unmenge an Text auf dem Screen dargestellt werden soll, ist mir auch noch nicht ganz klar. Jedoch fasziniert mich am Thema der Punkt, dass mich auch immer aufregt, wie limitiert die Gestaltungsmöglichkeit in typografischer Hinsicht ist. Auch mit CSS. Deshalb bastle ich auch gerne mit sIFR usw rum. Auf der anderen Seite: Mit ein paar Kniffen lässt sich wiederum eine Menge herausholen...

@Treverer: Was mir gerade noch einfällt: Die Druckfunktion stellt den Text bei mir nicht korrekt dar - wird immer abgeschnitten bei der letzten Spalte (FF und IE). Das lässt sich natürlich einfach beheben durch ein CSS fürs Printlayout - aber Antarctica hat natürlich recht... vielleicht wäre es fürs Drucken / Offlinelesen sinnvoll noch PDFs anzubieten.... (hat jetzt natürlich mit dem Programmierungs-Problem nix zu tun...)
 
Dein Problem ist, dass du mit HTML etwas machen willst, für das HTML eigentlich nicht geschaffen ist. Kleiner Tipp: Schau dir mal PDF an ;-)

tja, das ist aber für mich keine lösung. aus einem openoffice dokument ein pdf generieren und zum download anbieten ist ja keine kunst. ich will aber ein cms mit spaltensatz etc.pp...

mit der einstellung "kann man nicht machen", wo wären wir da heute *buck*
.
EDIT :
.

Ja du hast natürlich schon recht. HTML ist dafür nicht gedacht und selbst mit CSS zu limitiert. Daran wird wohl auch CSS3 nicht viel ändern und bis das erstmal überall implementiert ist ;)
Weshalb so eine Unmenge an Text auf dem Screen dargestellt werden soll, ist mir auch noch nicht ganz klar. Jedoch fasziniert mich am Thema der Punkt, dass mich auch immer aufregt, wie limitiert die Gestaltungsmöglichkeit in typografischer Hinsicht ist. Auch mit CSS. Deshalb bastle ich auch gerne mit sIFR usw rum. Auf der anderen Seite: Mit ein paar Kniffen lässt sich wiederum eine Menge herausholen...

@Treverer: Was mir gerade noch einfällt: Die Druckfunktion stellt den Text bei mir nicht korrekt dar - wird immer abgeschnitten bei der letzten Spalte (FF und IE). Das lässt sich natürlich einfach beheben durch ein CSS fürs Printlayout - aber Antarctica hat natürlich recht... vielleicht wäre es fürs Drucken / Offlinelesen sinnvoll noch PDFs anzubieten.... (hat jetzt natürlich mit dem Programmierungs-Problem nix zu tun...)

sagen wir mal so: das problem und die sache nach einer lösung verselbstständigen sich manchmal - es reizt einfach, eine lösung zu finden. vor jahren hieß es auch noch, silbentrennung in html ginge nicht. und heute? der clou ist doch, sowas dann doch möglich zu machen.

was drucken und pdf vorschau betrifft: vergiss es, läuft alles noch nicht. :]

und was die länge der texte betrifft: ich habe schon ganze bücher gelesen in normalen" html. ist halt anstrengend. wird doch eher mehr als weniger, solche online veröffenlichungen. im grunde halt e-book im browser. aber beim ebook bastelt - wenn ich richtig orientiert bin - auch wieder jeder hersteller an eigenen format(ierungen) herum. wie bereits gesagt: ich will es einfach in joomla einbauen, der autor braucht sich um spaltensatz und silbentrennung nicht kümmern...

was die letzte zeile eines gesplitteten absatzes betrifft: es sieht schon klar besser außer, wenn diese auch als blocksatz dargestellt wird, da man es sonst immer für das ende des absatzes selbst hält. diese sache zu verfolgen wird heute aber nicht mehr gehen: guten rutsch wünsche ich!
 
Zurück
Oben Unten