Marquee met afbeeldingen

brandlijn · Bericht door **brandlijn** » 31 augustus 2010, 22:14

Goedendag,

Al surfend kwam ik een marquee tegen met afbeeldingen met daaronder een link naar een website.
Zelf heb ik wel vaker een marquee toegepast, maar nooit op deze manier.
Ik heb even gesnuffeld bij de broncode, maar ben hier niet handig genoeg voor om aan de hand van deze code het zelfde toe te passen op mijn eigen website.
Wie wil mij op weg helpen.
De code die ik heb gevonden is als volgt (misschien heb ik te veel code gekopieerd...)
Alvast bedankt,
Jan

Code: Selecteer alles

<script type="text/javascript">
marqueeInit({
uniqueid: 'sponsoren',
inc: 5, //speed - pixel increment for each iteration of this marquee's movement
mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
moveatleast: 2,
neutral: 150,
savedirection: true,
style: {
'width': '100%',
'height': '95px' //<--No comma following the very last line!
}
});
</script>

Frederik · Bericht door **Frederik** » 31 augustus 2010, 23:54

Lijkt mij weer typisch JavaScript voor Internet Explorer want als ik deze javascript code in Kompozer plak, opsla en bekijk krijg ik helemaal niets te zien. Werkt dus niet.
Overigens is het gebruik van een Marquee fout html gebruik. Het wordt nergens gebruikt behalve in Microsoft applicaties.
Alsof je dat nodig hebt om op te willen vallen met je website

Ben overigens wel benieuwd waar je dat bent tegengekomen, heb het op de manier die je beschrijft nooit eerder gezien.

brandlijn · Bericht door **brandlijn** » 1 september 2010, 11:50

Dag Frederik,
Bedank voor deze eerste reactie,
Misschien wel een fout html gebruik maar wel praktisch....
Ik heb het gevonden op http://www.klompenfeest.nl/
Aangezien ik ook een website beheer waarop de logo's van sponsoren een belangrijke plaats innemen wilde ik dit ook wel eens toepassen.............

Groet,
Jan

nirwana · Bericht door **nirwana** » 1 september 2010, 12:49

Even een snelle reactie: de website van het Klompenfeest maakt gebruik van iets wat ze de Text and/or Image Crawler noemen: http://www.klompenfeest.nl/js/crawler.js

Ze noemen het wel een marquee, maar dit is een stuk Javascript dat gelukkig geen gebruik maakt van het marquee-element. Het marquee-element is namelijk indertijd door Microsoft in Internet Explorer geintroduceerd, maar is geen onderdeel van de HTML-standaard. Daarom is de ondersteuning in andere browsers niet vanzelfsprekend en kun je beter gebruik maken van Javascript om een dergelijk effect in diverse browsers te bereiken.

brandlijn · Bericht door **brandlijn** » 1 september 2010, 15:47

Martijn,

Bedankt voor de uitleg en je wijsheid.
Vraag die mij dan rest, hoe kan ik dit zelf toepassen?

Groet,
Jan

nirwana · Bericht door **nirwana** » 1 september 2010, 20:33

Jan,

De basis-uitleg staat bij Dynamic Drive.
Als je dat volgt dan zou het moeten lukken.

Wat daar bij Step 1 vermeld staat, dan plaats je ergens tussen <head> en </head> in je webpagina.

Wat daar bij Step 2 vermeld staat, dan plaats je ergens tussen <body> en </body> in je webpagina.
Die code voeg je toe op de plaats waar je de "marquee" op de site wilt invoegen.

Als je in de code van de Klompenfeest-site kijkt, dan staat er de volgende code (de namen van de sponsoren heb ik vervangen):

Code: Selecteer alles

<div class="sponsor_bar">
    <div id="sponsoren">
        <a href="http://www.sponsor1.nl" target="_blank"><img src="images/sponsoren/logo_sponsor1.jpg" alt="" style="vertical-align: middle;" /></a>
        <a href="http://www.sponsor2.nl" target="_blank"><img src="images/sponsoren/logo_sponsor2.jpg" alt="" style="vertical-align: middle;" /></a>
    </div>
</div>

De sponsor_bar div zal vast bedoeld zijn om de balk op de juiste plaats te zetten. Die kun je misschien wel weglaten, maar voor de zekerheid vermeld ik hem hier. Die sponsoren-div is waar het om gaat, want daar verwijs je in het script naar. Ten opzichte van het voorbeeld van Dynamic Drive heeft de Klompenfeest-site er een link (die in een nieuw venster opent) aan toegevoegd. Dat is handig om direct mee naar de website van de betreffende sponsor te verwijderen.

brandlijn · Bericht door **brandlijn** » 15 september 2010, 21:33

Beste Martijn,

Ik heb een test opstelling gemaakt
http://truckersevenementenapeldoorn.nl/ ... bloon.html
Het probleem waar ik nog tegen aanloop is de lopende tekst ( is het nu een marquee?) boven de afbeeldingen.
Ik wil deze marquee er niet bij hebben
Wanneer ik simpel de tekst weghaal dan crasht de webrowser en kan de pagina niet openen.
Hoe kan ik de tekst weghalen of wanneer ik dit wel ergens wil toepassen wil op een andere manier vormgeven, bijv. de tekst over de gehele pagina uitlijnen.

Graag een reactie

Groet,
Jan

nirwana · Bericht door **nirwana** » 15 september 2010, 22:49

Jan,

Hier is jouw code weer en volgens mij werkt het nu wel goed: http://www.mozbrowser.nl/web/marquee/marquee.html

Je had zowel een mycrawler als een mycrawler2 in je code staan. In het script werd naar mycrawler gerefereerd. Ik heb mycrawler (dat was die lopende tekst) verwijderd en het script naar mycrawler2 verwezen. Natuurlijk staat het jou vrij om mycrawler2 te hernoemen naar bijvoorbeeld sponsoren. Alleen moet je dat dan wel op de beide plaatsen doen.

Eerst had ik alleen de tekst uit mycrawler verwijdert, maar daar kon Firefox erg slecht tegen. Het leverde nog net geen crash op, maar de browser had het er wel erg druk mee. Maar goed, de browser werd verwezen naar een mycrawler en als daar dan niets in staat en het script gaat er toch somehow mee aan de slag dan kan het wel eens fout lopen. Overigens had het script hiertegen beschermd moeten zijn. Volgens mij kun je de volgende zaken in zo'n script redelijk snel testen:
1) bestaat het opgegeven element überhaupt ?
2) bevat het opgegeven element wel enige tekst ?
Maar goed, het script wordt gratis ter beschikking gesteld, dus hoor je ons niet klagen.

MozBrowser

Marquee met afbeeldingen

Marquee met afbeeldingen

Re: marquee met afbeeldingen

Re: marquee met afbeeldingen

Re: Marquee met afbeeldingen

Re: Marquee met afbeeldingen

Re: Marquee met afbeeldingen

Re: Marquee met afbeeldingen

Re: Marquee met afbeeldingen