Hoe heet dit en kan dit in HTML?

[bregweb]

Ik ben aan het kijken of ik de website voor onze voetbalclub kan nabouwen en verbeteren. Ik ben systeembeheerder, maar geen website bouwer, dus ben mijn HTML en CSS kennis weer aan het opfrissen. Het gaat om deze site:

http://scbdorp.nl/

Nu zie je bovenin een bar met onze sponsors door het beeld schuiven met hyperlinks. Hoe heet zo`n balk en kan ik die nabouwen in HTML? Mocht dit niet kunnen in HTML, in welke richting moet ik dan gaan zoeken qua tutorials?

[Cyphax]

Ik zou denk ik voor de makkelijke weg gaan en jQuery + een plugin gebruiken. Een voorbeeld daarvan is http://logicbox.net/jquery/simplyscroll/
Je hoeft niet echt een expert te zijn om dat voor elkaar te krijgen op zich dus probeer dat eens

Zo'n scrollende balk wordt over het algemeen ticker genoemd, maar meestal zie je dat in combinatie met bijvoorbeeld nieuwsheadlines.

[ Voor 21% gewijzigd door Cyphax op 25-11-2014 15:20 ]

[Powergrim]

Ik zou het nog veel makkelijker doen, volgens mij kom je hier een heel eind mee uit de voeten:

http://www.way2tutorial.com/html/html_marquee_tag.php

Heb je niet eens JS of wat dan ook nodig. Of het de nette oplossing is weet ik niet, maar je geeft al aan vrij weinig kennis te hebben. Dus dit is misschien een makkelijke instap.

[iH8]

Powergrim schreef op dinsdag 25 november 2014 @ 15:20:
Ik zou het nog veel makkelijker doen, volgens mij kom je hier een heel eind mee uit de voeten:

http://www.way2tutorial.com/html/html_marquee_tag.php

Heb je niet eens JS of wat dan ook nodig. Of het de nette oplossing is weet ik niet, maar je geeft al aan vrij weinig kennis te hebben. Dus dit is misschien een makkelijke instap.

Dat is echt not done, wel echt retro mits ie nog werkt. Ik zou er toch maar mijlenver van wegblijven.

http://en.wikipedia.org/wiki/Marquee_element

The W3C advises against its use in HTML documents.

Cyphax schreef op dinsdag 25 november 2014 @ 15:19:
Ik zou denk ik voor de makkelijke weg gaan en jQuery + een plugin gebruiken

Waarom iemand een library en plugin aansmeren als zoiets tegenwoordig gewoon keurig kan in CSS? Voorbeeldje

[ Voor 22% gewijzigd door iH8 op 25-11-2014 15:42 . Reden: CSS voorbeeld toegevoegd ]

[WeHoDo]

Waarom geen Wordpress website met een banner module?
Zijn er veel van te vinden. Via Artisteer kun je dan zelf een mooi ontwerp maken.

[bregweb]

Bedankt voor de antwoorden, ik ga met de gegeven hints aan de slag!

[Younes]

Laat even weten hoe het is geworden. Ben wel benieuwd

[Xantios]

Powergrim schreef op dinsdag 25 november 2014 @ 15:20:
Ik zou het nog veel makkelijker doen, volgens mij kom je hier een heel eind mee uit de voeten:

http://www.way2tutorial.com/html/html_marquee_tag.php

Heb je niet eens JS of wat dan ook nodig. Of het de nette oplossing is weet ik niet, maar je geeft al aan vrij weinig kennis te hebben. Dus dit is misschien een makkelijke instap.

Ik had op dit moment graag een +1 humor knop gewild....
_{tenzij dit geen grapje is, dan}

[ByteMe_]

Ik zou ook wat doen aan die opendir

[iH8]

RonaldDesigns schreef op woensdag 26 november 2014 @ 16:30:
Ik zou ook wat doen aan die opendir

[DJMaze]

Cyphax schreef op dinsdag 25 november 2014 @ 15:19:
Ik zou denk ik voor de makkelijke weg gaan en jQuery + een plugin gebruiken.

Wij zijn hier toch geen stackoverflow?

Het kan ook gewoon in CSS
http://designshack.net/articles/css/infinitephotobanner/

[ Voor 37% gewijzigd door DJMaze op 26-11-2014 18:11 ]

[iH8]

DJMaze schreef op woensdag 26 november 2014 @ 18:09:
Het kan ook gewoon in CSS

Ej, hoor ik daar een echo?

[ByteMe_]

iH8 schreef op woensdag 26 november 2014 @ 17:25:
[...]

Lijkt me handig als je de hele website wilt aanpassen dat je ook meteen directory listing uitzet.

[iH8]

RonaldDesigns schreef op woensdag 26 november 2014 @ 20:15:
[...]


Lijkt me handig als je de hele website wilt aanpassen dat je ook meteen directory listing uitzet.

Kan aan mij liggen want ik heb er al een lange dag op zitten, maar ik zie geen opendir? Waar doel je op, je begint zonder iets/iemand te quoten over opendirs...

[ByteMe_]

Daar kan je met een goede Inspector makkelijk achterkomen. Dat hoef ik toch niet uit te leggen hoop ik.

Hij wilt de website nabouwen zegt hij in de TS. Dat is meer dan enkel een bewegende CSS/JS banner, dus geef ik hem 'n tip in het algemeen.

[Cyphax]

DJMaze schreef op woensdag 26 november 2014 @ 18:09:
[...]

Wij zijn hier toch geen stackoverflow?

Het kan ook gewoon in CSS
http://designshack.net/articles/css/infinitephotobanner/

Top, dan heeft ie twee mogelijke oplossingen en kan 'ie kiezen.

[iH8]

RonaldDesigns schreef op woensdag 26 november 2014 @ 20:26:
Daar kan je met een goede Inspector makkelijk achterkomen. Dat hoef ik toch niet uit te leggen hoop ik.

Hij wilt de website nabouwen zegt hij in de TS. Dat is meer dan enkel een bewegende CSS/JS banner, dus geef ik hem 'n tip in het algemeen.

Joh. Ik was niet op de hoogte van het feit dat er hier meteen sitechecks uitgevoerd worden als daar niet om gevraagd wordt. Beetje offtopic hoor.

[R4gnax]

DJMaze schreef op woensdag 26 november 2014 @ 18:09:
Het kan ook gewoon in CSS
http://designshack.net/articles/css/infinitephotobanner/

Met de kleine kanttekening dat dat idee niet werkt in Internet Explorer 9 en lager wegens gebrek aan ondersteuning voor CSS3 animations en de kanttekening dat CSS3 animations heel slecht ondersteund zijn in Android browser voor versie 4.

Goed; het betreft hier een kleine club-site en dan is het misschien okee, maar het is zeker nog niet geschikt voor het grote publiek.

[ Voor 9% gewijzigd door R4gnax op 27-11-2014 08:52 ]

[Bosmonster]

Xantios schreef op woensdag 26 november 2014 @ 16:24:
[...]


Ik had op dit moment graag een +1 humor knop gewild....
_{tenzij dit geen grapje is, dan}

Zo grappig is het niet

http://www.w3.org/TR/css3-marquee/

Was ooit bedoeld als CSS3-property!

[ Voor 6% gewijzigd door Bosmonster op 27-11-2014 09:34 ]

[iH8]

Bosmonster schreef op donderdag 27 november 2014 @ 09:33:
http://www.w3.org/TR/css3-marquee/

Was ooit bedoeld als CSS3-property!

Is het ook gewoon! In webkit dan

code:

.marquee {  
    overflow-x: -webkit-marquee;
    -webkit-marquee-direction: ahead|auto|backwards|down|forwards|inherit|left|reverse|right|up;
    -webkit-marquee-increment: small|medium|large;
    -webkit-marquee-repetition: {number};
    -webkit-marquee-speed: slow|normal|fast;
    -webkit-marquee-style: alternate|inherit|none|scroll|slide;
}

[Dido]

Cyphax schreef op woensdag 26 november 2014 @ 20:35:

80% van StackOverflow bestaat onderhand uit "Install this library for that!"-antwoorden.
Als je de aanbevelingen daar volgt, dan heb je voor een statische HTML pagina nog 30MB aan libraries nodig.

[DJMaze]

R4gnax schreef op donderdag 27 november 2014 @ 08:51:
Met de kleine kanttekening dat dat idee niet werkt in Internet Explorer 9 en lager wegens gebrek aan ondersteuning voor CSS3 animations en de kanttekening dat CSS3 animations heel slecht ondersteund zijn in Android browser voor versie 4.

Hierin heb je helemaal gelijk.
Echter zou het gebruik van IE9 0.01% moeten zijn, dus dat is niet iets waar je tijd in zou moeten steken.

edit:
Foute interpretatie van mij hier, Windows Vista kan IE10 niet draaien, ik dacht van wel

Op Android en andere mobiele/tablet browsers is jQuery ook niet echt een optie, je verstookt dan aardig wat accu en 4g data.
Daarnaast is het op een klein scherm ook erg schreeuwerig.
Een andere oplossing is wel te vinden.

[ Voor 6% gewijzigd door DJMaze op 27-11-2014 11:49 ]

[Cyphax]

Dido schreef op donderdag 27 november 2014 @ 09:56:
[...]

80% van StackOverflow bestaat onderhand uit "Install this library for that!"-antwoorden.
Als je de aanbevelingen daar volgt, dan heb je voor een statische HTML pagina nog 30MB aan libraries nodig.

Stiekem wist ik ook wel dat die gedachte erachter zit, maar om dan elk antwoord dat jquery aanraadt maar af te doen met "we zijn SO toch niet" vind ik dan weer het andere uiterste.

DJMaze schreef op donderdag 27 november 2014 @ 11:23:
[...]

Hierin heb je helemaal gelijk.
Echter zou het gebruik van IE9 0.01% moeten zijn, dus dat is niet iets waar je tijd in zou moeten steken.

1) die keuze is aan bregweb;
2) vergis je niet, bij bedrijven gaat dat niet altijd heel snel. IE9 is hier de default browser op alle workstations. Dat zijn er heel veel.

Op Android en andere mobiele/tablet browsers is jQuery ook niet echt een optie, je verstookt dan aardig wat accu en 4g data.

Ik zou op mobiel zo'n ticker uberhaupt niet op een mobiele site zetten (ook niet via puur CSS), maar dan nog; jQuery kan gewoon gecachet worden, toch? Als je een CDN als die van Google gebruikt? Data zou niet zo'n issue moeten hoeven zijn.

[ Voor 44% gewijzigd door Cyphax op 27-11-2014 11:31 ]

[DJMaze]

Cyphax schreef op donderdag 27 november 2014 @ 11:26:
Stiekem wist ik ook wel dat die gedachte erachter zit, maar om dan elk antwoord dat jquery aanraadt maar af te doen met "we zijn SO toch niet" vind ik dan weer het andere uiterste.

Nah niet echt het uiterste maar... persoonlijk vind ik het wel verrekte irritant dat andere libraries zoals Mootools, Prototype, DoJo, etc. nooit genoemd worden.
Als de TS een CMS kiest dat wordt geleverd met Mootools is het best onzinnig om dan ook nog eens jQuery te installeren.
Daarnaast zie ik ook vaak vragen waarom het niet werkt, en dan blijkt men 2 of zelfs 3 jQuery's in te laden omdat plugins zelf een versie inladen.

Zolang wij niet weten wat er op een site komt te staan is het niet handig om te antwoorden met een JavaScript library

[Oaquasis]

DJMaze schreef op donderdag 27 november 2014 @ 11:23:
[...]
Echter zou het gebruik van IE9 0.01% moeten zijn, dus dat is niet iets waar je tijd in zou moeten steken.
[...]

Volgens statscounter ( http://gs.statcounter.com...monthly-201410-201410-bar ) en W3Counter (http://www.w3counter.com/trends) is het gecombineerde gebruik van IE9 en lager toch echt ongeveer 7%. Ik vrees dus dat je, afhankelijk van je doelgroep, er wel rekening mee zult moeten houden.

[DJMaze]

Voetbalclub lijkt mij Nederlandse bezoekers (IE9 3.33%)
http://gs.statcounter.com...monthly-201410-201410-bar

Ik lees net dat Windows Vista gebruikers IE10 niet kunnen draaien.
Daarom neem ik mijn woorden wel terug.

[Cyphax]

DJMaze schreef op donderdag 27 november 2014 @ 11:33:
[...]

Zolang wij niet weten wat er op een site komt te staan is het niet handig om te antwoorden met een JavaScript library

Die logica geldt ook voor een pure CSS3-oplossing; je moet nou eenmaal aannames maken. Jouw oplossing zou mijn voorkeur ook hebben, mits de support er maar voor is en dat duurt nog even, helaas. Het beste vind ik dan om een aantal oplossingen te geven en bregweb een weloverwogen keuze te laten maken.
Verder ken ik niet alle Javascript-frameworks dus dat zul je me moeten vergeven. Als jij een oplossing weet met MooTools of Prototype; bring it, daar helpen we bregweb alleen maar mee.

[Bosmonster]

MooTools en Prototype?

[DJMaze]

Cyphax schreef op donderdag 27 november 2014 @ 11:47:
Als jij een oplossing weet met MooTools of Prototype; bring it, daar helpen we bregweb alleen maar mee.

Beetje googlen en je vind er zat zoals deze:
http://www.mashitup.de/so...ndex_with_autoScroll.html

Joomla is er zo één die MooTools gebruikt