getElementById

[IE8]

Het is voor een fotografie website waarbij de inlaadtijd ondergeschikt is aan de resolutie. De foto's worden in volle pracht weergegeven op grotere schermen, op kleinere schermen zie je slechts een gedeelte ervan. De bedoeling is de afmetingen te verkleinen zodat ze volledig weergegeven worden.

[leroy]

aha. Ik snap het.

Iets moois om te gebruiken is bijvoorbeeld lightbox. Ik zal je script even wat aanpassen en lightbox importeren.

Het zal er dan ongeveer zo uit komen te zien zoals ik liet zien op die website die ik in mijn vorige berichtje plaatste.

Deze doet het verkleinen tot een bepaalde percentage zodat de afbeelding overal netjes verkleind wordt waar nodig.

Groeten,

Leroy

[leroy]

Ik heb het volgende gemaakt.

De volledige code heb ik in een rar bestandje geplaatst bij dit berichtje.

De gebruikswijze:

index.html Dat is het bestandje waar eigenlijk alles in staat

js map Dat is het mapje waar alle javascript bestandjes in staan die deze slider nodig heeft. zoals het Lightbox script.

CSS map Dat is het mapje waar het CSS bestandje in staat voor de opmaak van het zogenaamde popupje

images map Dat is het mapje waar de plaatjes in staan voor het Lightbox Script

De pagina waar je de slider in wilt hebben daar zet je alles wat tussen de <script> en </script> tags staat

Op de plek waar je de slider wilt hebben moet je de volgende code neerzeten:

<div id="slider"></div>

Ik hoop dat je het snapt, zo niet, dan leg ik het nog een keer iets uitgebreider uit.

In index.html staat ook een klein beetje uitleg hoe je het moet gebruiken.

Wat misschien wel grappig is om te vertellen is dat je waarschijnlijk een van de weinigen (of de enige) nu bent die het Lightbox script (gedownload van deze website) zo aangepast heeft dat te grote afbeeldingen voor je scherm, automatisch verkleint worden naar iets wat wel zichtbaar is op je scherm.

Standaard zat deze functie er toch niet in, heb ik er zelf bij moeten programmeren.

Om het te zien werken kun je het rar-bestandje uitpakken op je bureaublad (maak eerst even een mapje aan). En open dan index.html.

Je browser zal nu geopend worden, en je ziet je slider werken.

Ow, ik bedenk me net ineens dat ik nieuw jouw kleuren heb gebruikt die in jouw slider stonden, maar dat kun je ook veranderen in het scriptje. (staat duidelijk aangegeven).

Ik heb er alleen geen silder speed ingezet, ben ik vergeten. Maar standaard staat deze op dezelfde snelheid als jouw script.

Het rar-bestandje:

[ATTACH]7200[/ATTACH]

Groeten,

Leroy

slider.rar

19 oktober 2010 aangepast door leroy

[IE8]

Bedankt voor de welwillendheid waarmee je mij wil helpen.

Je komt met een alternatief waarbij ik toch wel enkele bemerkingen heb (als dit mag):

1. De 'slider' die je voorstelt verloopt schokkend, mijn 'scroller' daarentegen vloeiend.

2. De 'slider' vertoont na het laatste beeld lege ruimte, bij mijn 'scroller' sluit het eerste beeld onmiddelijk aan na het laatste.

3. 'Lightbox' past de afmetingen niet aan aan de beschikbare schermgrootte, alhoewel hieraan kan verholpen worden door het

script te wijzigen, daarvoor zijn patches op het internet beschikbaar.

4. Jouw voorstel bevat meer dan 210 kB aan code, terwijl dat van mij het nog steeds met minder dan 4 kB doet.

5. Iets wat je zelf maakt heeft (bij mij) altijd een streepje voor op geleende codes.

Uit jouw vorige reacties heb ik enkele ideeën opgedaan die uitzicht geven op het gewenste resultaat en waarmee ik nu aan het

experimenteren ben. In ieder geval heel erg bedankt voor de inspanningen die je geleverd hebt.

Met vriendelijke groeten en nogmaals bedankt.

[leroy]

Ik heb nog even naar jouw scriptje gekeken, en ik snap je punten.

1. Dit komt omdat ik de Marquee tag heb gebruikt, en jouw scroller gaat met volledig javascript. Ik zie alleen bij mij thuis geen verschil. Ze gaan beide gewoon vloeiend (dit komt misschien door je pc zelf).

2. Klopt, dit komt door de Marquee, dit is wel te veranderen. Alleen zou ik even moeten nagaan hoe je de content laat aansluiten in een marquee-tag.

3. Dit heb ik in mijn script veranderd. Heb het wel alleen uitgetest op een scherm van 1280*1024 en een scherm van 1680*1050. Misschien gebruik je een kleiner scherm. Standaard in Lightbox zit deze verklein functie niet, je moet wel mijn versie gebruiken

4. De reden dat mijn stukje code meer ruimte inneemt is omdat lightbox plaatjes heeft voor onderandere op volgende en vorige te kunnen drukken. Ook lightbox zelf is redelijk wat code. Dit neemt ook plek in beslag. Ook zijn er CSS bestanden die bij Lightbox horen, deze nemen ook meer ruimte in beslag. maar was is 210KB nou? Zelfs de ouderwetse floppy heeft nog meer opslagcapaciteit.

5. Dit is zelf gemaakt, Lightbox is alleen een toevoeging aan het hele script zodat het grafischer mooier is/wordt.

Bij programmeurs is het altijd: "iets wat al eens gemaakt is en goed werkt, ga je niet nog eens maken". (je ontwerpt het wiel niet nog een keer).

Graag gedaan, en mocht er iets zijn kun je altijd even vragen. Ik zal nog wel op zoek gaan naar hoe je de marquee kan laten herhalen zonder open vrije ruimte. En ik zal nog even het Lightbox script aanpassen naar de resolutie van je scherm, dat hij dat automatisch wel pakt, en ook op kleinere schermen dan 1080*1024.

Groeten,

Leroy

[leroy]

Ik heb een nieuwe update voor je script.

Het bestandje lightbox.js in de map: js moet vervangen worden met de bijlage bij dit bericht. (ingepakt)

Hiermee zou de breedte van de plaatjes nu wel gewoon scherm vullend moeten zijn.

Waar ik nog geen oplossing voor heb is dat wanneer een plaatje te groot is voor op het scherm (een landscape plaatje). Dan wordt hij in de breedte wel goed neergezet, alleen in de hoogte nog niet 100% (in verhouding wel, alleen voor je scherm niet). Om het volledige plaatje te zien, zou je een stukje naar beneden moeten scrollen.

Om te zien wat ik bedoel, zou je een plaatje bij de images

[*] moeten zetten die sowieso landscape formaat heeft en die VEEL breder is als je scherm. pakweg 3000 pixels breedt.

Dan zie je dat je nog een klein stukje moet scrollen.

Het is mogelijk dat het plaatje wat ingeladen wordt niet direct verschijnt, maar dat je even moet wachten of met je muis over het plaatje moet gaan.

Dit kan ik er jammer genoeg zelf niet uithalen. Dit hoort bij Lightbox zelf.

De hapering is er nog NIET uitgehaald. En de mogelijkheid dat alles achter elkaar gezet wordt ook nog niet. Dit vond ik meer prioriteit hebben.

Bijlage:

[ATTACH]7258[/ATTACH]

Groeten,

Leroy

lightbox.rar

[IE8]

Fijn. Heel erg bedankt !

Met vriendelijke groeten.