Tips en trucs

WELKOM

Lichtkrant met zig zag zwevende tekst en/of plaatje
al dan niet met link naar een ander bestand op internet

Met behulp van onderstaande <marquee> codes kan je een lichtkrant met zigzag zwevende tekst en/of mini plaatje weergeven op een blog, webpagina of in een emailbericht versturen met Outlook Express of Windows mail en bekijken.
De lichtkrant kan je tevens al dan niet voorzien van een achtergrondkleur en/of achtergrondplaatje

Voor het weergeven van een afbeelding in een lichtkrant op een blog of in een emailbericht, dient het plaatjesbestand over een absolute URL (= internetadres, welke start met "http://") te beschikken.
Bij weergave op een website, kan voor de afbeelding gebruik worden gemaakt van een relatieve URL, wanneer het plaatjesbestand op een webserver, op hetzij gratis of gehuurde webruimte staat, samen met de webpagina waarin de lichtkrant zich bevindt.

Hierna de basis code voor een gecentreerde lichtkrant van 450px breed en 80px hoog:

<div align="center">
<marquee scrollAmount="3" direction="up" behavior="alternate" width="450" height="80">
<marquee scrollAmount="3" direction="right" behavior="alternate">
HIER KOMT DE TEKST EN/OF CODE VOOR DE AFBEELDING
</marquee></marquee></div>

Zie voorbeeld:

De afmetingen van de lichtkrant kunnen naar eigen wens worden aangepast door in de code voor het aangeven van de breedte, de huidige waarde 450 bij width="" te vervangen door een hoger of lager aantal pixels.
De hoogte kan evenzeer gewijzigd, door tussen de aanhalingstekens bij height="" het aantal pixels (hier 80) te vervangen door een hogere of lagere waarde

De snelheid waarmee de lichtkrant voortbeweegt is aanpasbaar bij scrollAmount=""
Vervang hiervoor de opgegeven waarde 3 door een hoger of lager aantal.
De richting "up" bij direction="" kan je vervangen door "down", alsook "right" door "left".

Op de plaats waar zich in de marquee code de tekst bevindt:

   HIER KOMT DE TEKST EN/OF CODE VOOR DE AFBEELDING

dient de tekst voor de lichtkrant te worden aangebracht, al dan niet voorzien van een code voor het aangeven van het gewenste lettertype, de lettergrootte, tekstkleur, vet of cursief
Ook is het mogelijk op die plaats, een code toe te voegen voor het weergeven van een afbeelding met of zonder verwijzing naar een ander bestand of webpagina op internet.

Al naar gelang uw wensen kan je hieronder één of meer HTML codes kopieren voor de opmaak van tekst of voor het weergeven van een afbeelding en deze in de hierbovenstaande marquee code plakken ter vervanging van de in hoofdletters cursief getypte tekst

Hierna kan je kiezen uit:

1)- De code voor het aangeven van het gewenste lettertype, de lettergrootte en tekstkleur:

<font face="LETTERTYPE" color="#KLEURCODE" size="LETTERGROOTTE"> HIER KOMT DE TEKST </font>

Vervang in de code de tekst: LETTERTYPE, KLEURCODE, LETTERGROOTTE
door het lettertype, de kleurcode en de lettergrootte, dat je uw tekst in de lichtkrant wenst te geven
Bijvoorbeeld :
<font face="Comic sans MS" color="#CC0000" size="4">HIER KOMT DE TEKST</font>

2)- De code voor een "aanklikbare" tekst in het gewenste lettertype, tekstkleur en lettergrootte:

<a href="HIER_URL_LINK" target="_blank">
<font face="LETTERTYPE" color="#KLEURCODE" size="LETTERGROOTTE"> HIER KOMT DE TEKST </font></a>

3)- De code voor het weergeven van een afbeelding:

    <img src="HIER_URL_PLAATJE" border="0">

4)- De code voor het weergeven van een aanklikbare afbeelding met link naar een andere bestemming:

<a href="HIER_URL_LINK" target="_blank">
<img src="HIER_URL_PLAATJE" border="0"></a>

Vervang in de hier bovenstaande codes :
   HIER_URL_PLAATJE door de URL van uw plaatje
   HIER_URL_LINK door de URL van de site of blog of het bestand op internet,
   welke dient te openen, wanneer op het plaatje geklikt wordt

Met target="_blank" wordt aangegeven dat het aangeklikte document in een nieuw extra venster opent. Wens je dit niet, dan kan je "_blank" vervangen door "_self".

Hierna een voorbeeld waarbij de URL van mijn plaatje en de URL van blog Blogtips in de HTML code voor het weergeven van een aanklikbaar plaatje is aangebracht:

<a href="http://blog.seniorennet.be/blogtips" target="_blank">
<img src="http://i44.tinypic.com/2qioges.gif" border="0"></a>

Wanneer we de hierbovenstaande HTML code voor het weergeven van een aanklikbaar plaatje met link naar een andere bestemming,
ook de code voor het weergeven van tekst in de 2de marquee code aanbrengen,

dan ziet de marquee code er zo uit.

<div align="center">
<marquee scrollAmount="3" direction="up" behavior="alternate" width="450" height="80">
<marquee scrollAmount="3" direction="right" behavior="alternate">
<a href="http://blog.seniorennet.be/blogtips" target="_blank"/>
<img src="http://i44.tinypic.com/5o9xz8.jpg" border="0"></a>
<font face="Comic sans MS" color="#cc0000" size="5"><strong> WELKOM </strong></font>
</marquee></marquee></div>

Het resultaat ziet je hier, klik even op het plaatje:

WELKOM

De lichtkrant kunnen we ook nog voorzien van een achtergrondkleur.

In dit geval dient in één of in beide opeenvolgende marquee codes de attribuut:
bgcolor="" toegevoegd, waarin tussen de aanhalingstekens de gewenste kleurcode dient geplaatst.
In de 1ste marquee code voor het niet bewegende gedeelte van de lichtkrant.
In de 2de marquee voor het zwevende gedeelte.

Hierna de code voor een gecentreerde lichtkrant van 450px breed en 80px hoog met een donkerblauwe achtergrondkleur voor het stilstaande gedeelte van de lichtkrant en een lichtblauwe achtergrondkleur voor het bewegende gedeelte.

<div align="center">
<marquee scrollAmount="2" direction="up" behavior="alternate" width="450" height="80" bgcolor="#3366FF">
<marquee scrollAmount="2" direction="right" behavior="alternate" bgcolor="#b2d8fd">
HIER KOMT DE TEKST EN/OF CODE VOOR DE AFBEELDING
</marquee></marquee></div>

De achtergrondkleur kan je wijzigen bij bgcolor="" door tussen de aanhalingstekens de kleurcode #3366FF en/of #b2d8fd te vervangen door een andere kleurcode

Ter info: de achtergrondkleuren zijn pas zichtbaar bij voorvertonen in de browser of op internet bekeken

Zie voorbeelden

Voor de lichtkrant hierboven en hieronder werden twee achtergrondklleuren toegevoegd.
bgcolor="#3366FF" in de 1ste marquee code en bgcolor="#b2d8fd" in de 2de marquee code.

WELKOM

Hierna een lichtkrant waarbij enkel bgcolor="#b2d8fd" in de 2ste marquee code is toegevoegd

WELKOM

Voor het creëren van een lichtkrant met achtergrondafbeelding maken we gebruik van een TABEL met daarin de attribuut background=""

Tussen de aanhalingstekens bij background="" dient de URL van het achtergrondplaatje geplakt.

- De randkleur geven we aan bij borderColor=""
door tussen de aanhalingstekens de gewenste kleurcode te plakken (bvb:  #3366FF)

- De dikte van de rand bepalen we met de attribuut border=""
Hoe hoger het getal tussen de aanhalingstekens hoe dikker de boord en omgekeerd.
Bij het cijfer 0 wordt geen boord weergegeven en dus ook geen kleur.

- De opvulling bij cellpadding="" en de tussenruimte bij cellspacing=""
is eveneens aanpasbaar, evenals de hoogte bij height="" en de breedte bij width=""
door een hogere of lagere waarde (getal) tussen de aanhalingstekens in te vullen

De marquee codes voor de lichtkrant plaatsen we tussen de elementen <td> en </td>.

Hierna de basiscode voor een tabel met achtergrondafbeelding, rand- en achtergrondkleur, met daarin de code voor de lichtkrant, waarbij de meeste gegevens nog dienen ingevuld.

<table width="450" height="80" cellSpacing="2" cellPadding="8" border="3" borderColor="" bgColor="" align="center" background="">
<tbody>
<tr>
<td valign="middle">
<div align="center">
<marquee scrollAmount="2" direction="up" behavior="alternate" width="450" height="80">
<marquee scrollAmount="2" direction="right" behavior="alternate">
HIER KOMT DE TEKST EN/OF CODE VOOR DE AFBEELDING
</marquee></marquee></div>
</td></tr></tbody></table>

Hieronder een voorbeeld van een aangepaste basiscode, met deze lichtkrant als resultaat:

WELKOM

<table width="450" height="80" cellSpacing="2" cellPadding="8" border="3" borderColor="#3366FF" bgColor="#b2d8fd" align="center" background="http://i43.tinypic.com/6qh743.jpg">
<tbody>
<tr>
<td valign="middle">
<div align="center">
<marquee scrollAmount="2" direction="up" behavior="alternate" width="450" height="80">
<marquee scrollAmount="2" direction="right" behavior="alternate">
<a href="http://blog.seniorennet.be/blogtips" target="_blank">
<img src="http://i44.tinypic.com/5o9xz8.jpg" border="0"></a>
<font face="Comic sans MS" color=#cc0000 size=5><strong> WELKOM </strong></font>
</marquee></marquee></div>
</td></tr></tbody></table>

Ter info:
HET IS NIET TOEGELATEN DE URL'S VAN MIJN PLAATJES TE GEBRUIKEN.
Deze URL's worden trouwens regelmatig vervangen, waardoor de huidige verder onbruikbaar worden.
Kopieren en plakken van mijn lichtkranten met plaatjes = linken en eveneens niet toegestaan..

Welkom Klik op het plaatje

De lichtkrant werkt pas goed, wanneer de code correct aangebracht is.
Zorg dus steeds goed dat er geen ruimte (spatie) of aanhalingstekens teveel of te weinig in de code voorkomen en alles correct ingevuld is.