Javascript Text Collapse
Door Zero XT, 18 jaar geleden, 5.192x bekeken
Ik zie een heleboel sites die gewoon wisselt tussen de display none en block eigenschappen waardoor tekst en afbeeldingen uit het niets verschijnen en weer verwijderen. Ik wilde dit oplossen door het langzaam te laten verschijnen of te laten verdwijnen.
Met dit eenvoudig stukje JavaScript heb je die mogelijkheid. Je kan ook de snelheid aan passen. Hoe hoger het getal, hoe langzamer het gaat.
Voorbeeld: http://leaked.nl/javascript slider/
Gesponsorde koppelingen
PHP script bestanden
Er zijn 18 reacties op 'Javascript text collapse'
0 
-0 
-0
Erg nice, vooral als je niet met een js library werkt of je niets meer wilt.
Je ziet hem alleen even flikkeren hier(Firefox 2.0.0.14)
Je ziet hem alleen even flikkeren hier(Firefox 2.0.0.14)
0 -0
-0
@Tha Wizekid:
Dat flikkeren doet hij maar heel af en toe bij mij. Maar dan is mijn CPU even met iets anders bezig.
@mebus:
Omdat ik het zelf wilde maken. Ik maak geen gebruik van frameworks.. maar dat is een discussie apart.
Dat flikkeren doet hij maar heel af en toe bij mij. Maar dan is mijn CPU even met iets anders bezig.
@mebus:
Omdat ik het zelf wilde maken. Ik maak geen gebruik van frameworks.. maar dat is een discussie apart.
0 -0
-0
@Jaron:
1 regel + het hele framework. Dan is dit toch net ietsjes korter en hier leer je tenminste wat van. Dit is basis JavaScript in plaats van een regeltje toevoegen waar je niets van leert omdat je een framework gebruikt.
Laat toekomstige opmerkingen aub niet meer gaan over frameworks.. ik word er moe van:P
1 regel + het hele framework. Dan is dit toch net ietsjes korter en hier leer je tenminste wat van. Dit is basis JavaScript in plaats van een regeltje toevoegen waar je niets van leert omdat je een framework gebruikt.
Laat toekomstige opmerkingen aub niet meer gaan over frameworks.. ik word er moe van:P
0 -0
-0
Ik vind het echt cool dat je dit hebt gemaakt. Zelf gebruik ik ook geen framework, simpelweg omdat ik JavaScript al ken en dan zit ik ook niet vast aan een framework. Ik snap wel de voordelen ervan, maar Eigen JavaScript vind ik leuker en uitdagender.
Ik vind dat je hem mooi gemaakt hebt!
Ik vind dat je hem mooi gemaakt hebt!
0 -0
-0
Mag ik vragen waarvoor je 3 globale variabelen en 3 globale functies nodig hebt? Dit kan in 1 enkele globale functie. Waarom geef je strings mee aan setInterval?
0 -0
-0
leuk scriptje, maar erg netjes vind ik hem ook niet.
Enkele kritiek:
- waarom gebruik je strings in je setInterval?
- wat is de meerwaarde van 0001 tegenover gewoon 1? De waarde is exact hetzelfde.
- het gebruik van globale variabelen en functies is af te raden omdat dit conflicten kan veroorzaken met andere functionaliteiten. je kan dit prima verwerken in 1 functie verwerkt in een logisch namespace principe.
- je cleart op 4 plaatsen de interval... 2 zou voldoende moeten zijn als ik er zo naar kijk.
Enkele kritiek:
- waarom gebruik je strings in je setInterval?
- wat is de meerwaarde van 0001 tegenover gewoon 1? De waarde is exact hetzelfde.
- het gebruik van globale variabelen en functies is af te raden omdat dit conflicten kan veroorzaken met andere functionaliteiten. je kan dit prima verwerken in 1 functie verwerkt in een logisch namespace principe.
- je cleart op 4 plaatsen de interval... 2 zou voldoende moeten zijn als ik er zo naar kijk.
0 -0
-0
Deze is ietwat beter opgezet en kleiner zonder framework
http://sandbox.leigeber.com/accordion/index.html
http://sandbox.leigeber.com/javascript-accordion/index.html
http://sandbox.leigeber.com/accordion/index.html
http://sandbox.leigeber.com/javascript-accordion/index.html
0 -0
-0
ik denk dat een slome computer er ook niet echt blij van wordt omdat je elke 1 milliseconde de hoogte overnieuw uitrekent ipv uitrekenen om de hoeveel milliseconde je 1pixel om laag moet.
0 -0
-0
@Ypma:
Bedankt voor alle punten. Ik ga er mee aan de slag en zal de nieuwe zodra hij klaar is uploaden.
@remie:
Ik heb het getest op een laptop. Windows 2000, 700MHz CPU en 300MB geheugen. Dat alles in Internet Explorer 6.
Het liep vlekkeloos en dat komt omdat je denkt dat de functie meer word aangeroepen naarmate je lange tekst heb maar dat is niet zo. Er zit een exponentiële groei in het aantal pixels dat er bij komen of eraf gaan. Dus als de div hoogte 1000 pixels is gaat er bijv. 20pixels per keer eraf terwijl als een div 10 pixels hoog is er maar 1 pixel per keer af gaat. Hij zal die functie ook niet meer dan 20-40 keer aanroepen en daar kijkt zelfs de CPU van de laptop van 700MHz niet van op.
Bedankt voor alle punten. Ik ga er mee aan de slag en zal de nieuwe zodra hij klaar is uploaden.
@remie:
Ik heb het getest op een laptop. Windows 2000, 700MHz CPU en 300MB geheugen. Dat alles in Internet Explorer 6.
Het liep vlekkeloos en dat komt omdat je denkt dat de functie meer word aangeroepen naarmate je lange tekst heb maar dat is niet zo. Er zit een exponentiële groei in het aantal pixels dat er bij komen of eraf gaan. Dus als de div hoogte 1000 pixels is gaat er bijv. 20pixels per keer eraf terwijl als een div 10 pixels hoog is er maar 1 pixel per keer af gaat. Hij zal die functie ook niet meer dan 20-40 keer aanroepen en daar kijkt zelfs de CPU van de laptop van 700MHz niet van op.
0 -0
-0
@HellRazer,
Wat is er erg aan het gebruiken van een framework? Waarom is het erg om daar aan vast te zitten? Zo ongeveer iedereen gebruikt tegenwoordig een framework en dat is omdat het voordeel duidelijk bewezen is.
Wat is er erg aan het gebruiken van een framework? Waarom is het erg om daar aan vast te zitten? Zo ongeveer iedereen gebruikt tegenwoordig een framework en dat is omdat het voordeel duidelijk bewezen is.
0 -0
-0
@Midas, omdat iedereen het gebruikt hoeft het niet beter te zijn.
Het is uiteraard makkelijker om code te schrijven maar je kan er lang niet alles mee, elk framework is idioot groot of heeft te niet te features die je moet hebben en je krijgt veel functies die je nooit gebruikt.
Het is uiteraard makkelijker om code te schrijven maar je kan er lang niet alles mee, elk framework is idioot groot of heeft te niet te features die je moet hebben en je krijgt veel functies die je nooit gebruikt.
0 -0
-0
Ik vind dit ZO geweldig, niet sarcastisch. Ik ben hier zelf al tijden mee bezig en die hoogte lukt niet. Hiermee gaat het perfect. 10/10 :)
0 -0
-0
leuk script maar als je nou een inhoud hebt die steeds veranderd? ik heb er mee zitte stoeien maar hij onthoud de hoogte van de vorige inhoud.
denk iemand mij te kunnen helpen met dit probleem of is dit niet mogelijk met het bovenstaande js script
denk iemand mij te kunnen helpen met dit probleem of is dit niet mogelijk met het bovenstaande js script
0 -0
-0
klein bugje,
als je de tekst eruit haalt, zet ie bij elke keer dat je klikt een pixel hoogte erbij...
en waarvoor gebruik je "return false"
want het werkt ook zonder.
verder netjes script
als je de tekst eruit haalt, zet ie bij elke keer dat je klikt een pixel hoogte erbij...
en waarvoor gebruik je "return false"
want het werkt ook zonder.
verder netjes script
0 -0
-0
Quote:
koen schreef op 30.10.2009 15:20
klein bugje,
als je de tekst eruit haalt, zet ie bij elke keer dat je klikt een pixel hoogte erbij...
en waarvoor gebruik je "return false"
want het werkt ook zonder.
verder netjes script
klein bugje,
als je de tekst eruit haalt, zet ie bij elke keer dat je klikt een pixel hoogte erbij...
en waarvoor gebruik je "return false"
want het werkt ook zonder.
verder netjes script
Dat script is zo gebouwd dat het om de zoveel tijd (een interval) de div of whatever it is groter maakt. Zo lijkt het dus of die open en dicht 'klapt'.
Die return false is goed en moet ook als er een 'echte link' wordt gebruikt, anders gaat de browser die link volgen.
Het is denk ik zelfs beter als die return false in die slide functie zou worden gestopt.
In php kan je ook dit doen:
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
$var1 = '3 appels';
$var2 = '5 peren';
$var3 = $var1 + $var2;
var_dump($var3);
# Levert 8
[/code]
Dat werkt wel, maar dat moet je dus nooit doen. Zelfde geldt hier, het werkt wel zonder, maar is niet goed.
$var1 = '3 appels';
$var2 = '5 peren';
$var3 = $var1 + $var2;
var_dump($var3);
# Levert 8
[/code]
Dat werkt wel, maar dat moet je dus nooit doen. Zelfde geldt hier, het werkt wel zonder, maar is niet goed.
Om te reageren heb je een account nodig en je moet ingelogd zijn.
PHP hulp
0 seconden vanaf nu