__
.
DNS4 
zoeken
  ⑬
«

HTML
Vertikale tekst crossbrowser

Het is eenvoudig om vertikale tekst in strict-browsers op het scherm te zetten en dat geldt ook voor vertikale tekst in IE. Het wordt wat lastiger als je recht-opstaande tekst in ALLE browsers wilt tonen. Met een beetje Javascript is het te doen.

Voor IE wordt er CSS3 (writing-mode) gebruikt en voor de overige browsers wordt er een object (type="image/svg+xml") gebruikt. Afhankelijk van de browser zet Javascript dan wel de ene- of de andere -manier op het scherm.

Het nadeel is dat je twee maal dezelfde tekst moet ingeven. Maar ik denk niet dat het de bedoeling is om hele pagina's vertikaal weer te geven... Buiten dat krijgen de bezoekers een stijve nek als ze steeds maar hun hoofd moeten draaien om de tekst te kunnen lezen.

De "vertical-text" procedure staat in deze file. Plaats de -style-code- in de head-sectie van de pagina en het stukje javascript op de plaats waar je de vertikale tekst wilt laten verschijnen. Doe de SVG-code in een file met een svg extensie, en verwijs in het object bij data= naar deze file. Vergeet niet om zowel in het stuklje javascript als in de svg-file de tekst (in dit voorbeeld: tekst rechtop) te vervangen door jouw tekst.

De titel van deze pagina is: Vertikale tekst crossbrowser / javascript vertical text.
De sleutelwoorden zijn : vertical, text, javascript, crossbrowser, vertikaal, tekst en script.
De omschrijving is: "Vertikale tekst met javascript en crossbrowser".