Mootools
Door Harmen , 20 jaar geleden, 9.138x bekeken
Een javascriptframework voor dynamische websites. Om wat voorbeelden te zien die in deze tutorial worden uitgelegd zou je hier kunnen klikken.
Update: Toegevoegd waarom je mootools zou gaan kiezen.
Gesponsorde koppelingen
Inhoudsopgave
- Wat kun je met mootools?
- Mootools “installeren”
- Elementen selecteren
- Voorbeeld 1: Tabs in mootools
- Voorbeeld 2: Coole effecten in mootools
- Mootools en Ajax
- Iets gaan doen met de elementen
- Voorbeeld 3 en handige links
Er zijn 29 reacties op 'Mootools'
0 
-0 
-0
Hier is mijn tutorial dan. Veel plezier met mootoolen.
Edit:
Dank je Bas, nu ziet het er wat beter uit (zonder dubbele pagina's)
Dank je Bas, nu ziet het er wat beter uit (zonder dubbele pagina's)
0 -0
-0
Herhaling is goed, maar of je nou serieus elke pagina dubbel moet posten... :P Anyway ik ga het eens doorlezen en hopelijk wordt ik dan wat wijzer van Mootools en kan ik het ook eens gaan gebruiken.
0 -0
-0
Ik heb het even vluchtig doorgekeken en ik ga het zeker downloaden en uitproberen op een rustiger tijdstip en een ander project. Tutorial ziet er goed uit en het voordeel is je hoeft maar de helft te lezen! (OK laatste opmerking is flauw!!)
0 -0
-0
Mootools is een erg mooi javascript framework :) erg handig! Goeie tut verder
0 -0
-0
Top,
had nog niet echt de energie gehad om eraan te beginnen, maar dit gaat me zeker over de drempel helpen.
had nog niet echt de energie gehad om eraan te beginnen, maar dit gaat me zeker over de drempel helpen.
0 -0
-0
Quote:
Waaaah, alle pagina's zijn dubbel :S!
Kun je niet snel ergens overheen lezen.
Ziet er goed uit.
0 -0
-0
hehe, dank jullie voor jullie positieve reacties en bedankt voor jullie gevoel van humor :P.
P.S. Alles ging dubbel: Eerst alle pagina's dubbel, toen een PM om de dubbele pagina's te verwijderen dubbel en als laatste mijn eerste reactie hierboven dubbel...
P.S. Alles ging dubbel: Eerst alle pagina's dubbel, toen een PM om de dubbele pagina's te verwijderen dubbel en als laatste mijn eerste reactie hierboven dubbel...
0 -0
-0
wat ik niet zie en wel verwacht had,
Waarom MooTools ipv bv. Prototype?
Waarom MooTools ipv bv. Prototype?
0 -0
-0
@Hipska
O ja, ik kan daar ook nog wel even wat over schrijven. Ik zal wel even een langer verhaal schrijven op de inleidingspagina.
Trouwens.. ik hoop dat Bas even langs komt, want zo lijkt het voor geen meter!
Bas, gooi ajb even alle 2e dubbele pagina's weg
O ja, ik kan daar ook nog wel even wat over schrijven. Ik zal wel even een langer verhaal schrijven op de inleidingspagina.
Bas, gooi ajb even alle 2e dubbele pagina's weg
0 -0
-0
Soms wat wazig taalgebruik maar toch goed te volgen. Mooi opstapje om nu eindelijk eens te verdiepen in mootools. Danke
0 -0
-0
Misschien ook even verwijzen naar andere JSFrameworks zoals jquery, prototype, etc (kan je mooi die laatste pagina: . voor gebruiken)
0 -0
-0
Ik heb dat toegevoegd op de eerste pagina "wat is mootools".
Het is volgens mij niet zo dat mootools veel beter is dan jquery en andersom. De enige die afvalt omdat het zo zwaar is is denk ik prototype. Keus ligt bij de gebruiker :)
Het is volgens mij niet zo dat mootools veel beter is dan jquery en andersom. De enige die afvalt omdat het zo zwaar is is denk ik prototype. Keus ligt bij de gebruiker :)
0 -0
-0
Dank je, Ik was een beetje te lui om mootools uit te zoeken, hoe en wat te installeren (had niet zo veel zin om dat allemaal uit te zoeken op dat moment).
Maar ik denk dat mootools voor mijn CMS en MCMS een mooie samenwerking kan aangaan gezien ik een CMS aan het schrijven ben die eigenlijk specifiek voor web 2.0 doeleinden is bedoeld.
Gezien ik graag een wat levendige manier van een (M)CMS wil bouwen en dat aangaande anti flash ben om daar een website mee te bouwen, is dit wel een uitkomst om toch hier wat mee te gaan doen.
Maar moet het maar even uitzoeken nog of ik dit kan integreren in mijn project. maar in ieder geval bedankt voor de uitleg.
Maar ik denk dat mootools voor mijn CMS en MCMS een mooie samenwerking kan aangaan gezien ik een CMS aan het schrijven ben die eigenlijk specifiek voor web 2.0 doeleinden is bedoeld.
Gezien ik graag een wat levendige manier van een (M)CMS wil bouwen en dat aangaande anti flash ben om daar een website mee te bouwen, is dit wel een uitkomst om toch hier wat mee te gaan doen.
Maar moet het maar even uitzoeken nog of ik dit kan integreren in mijn project. maar in ieder geval bedankt voor de uitleg.
0 -0
-0
Is het mogelijk om Ajax een standaard onStart en onComplete function te geven? de onStart moet uitgevoerd worden op het moment dat request() aangeroepen wordt, en onComplete nadat de custom onComplete is uitgevoerd... Zoiets heeft mijn eigen Ajax class wel, maar die is nu niet meer te gebruiken, omdat Mootools mijn Ajax lib overschrijft (op zich prima, want mootools is veel beter :)).
Maar als ik voor ELKE request (supersupersuperveel verschillende) elke keer weer een onStart en onComplete moet aanhangen.... bah bah
Iemand?
Maar als ik voor ELKE request (supersupersuperveel verschillende) elke keer weer een onStart en onComplete moet aanhangen.... bah bah
Iemand?
0 -0
-0
Niet dat het iets met jouw tutorial te maken heeft, maar ik heb er uren aan besteed om een oplossing te vinden voor de slider functie.
Mocht er toevallig iemand een slide bar gaan plaatsen in een element welke te verslepen is, ofwel de positie van het element kan veranderen. Dan vertoond de slider functie een raar effect.
Zodra je op de slide bar knop klikt, verplaatst deze zich onder je muis vandaan en komt weer terug zodra je de muis vast houd en dan zou bewegen.
Dat is dan al gauw een schoonheid foutje in je ontwerp, maar de oplossing ligt
hem erin om de mootools.js bestand even aan te passen op regel 4533 (als je alles hebt gedownload) maar in ieder geval bij de functie:
clickedElement:
en dan regel :
var position = event.page[this.axis] - this.element.getRelativePosition()[this.axis] - this.half;
vervangen met :
var position = event.page[this.axis] - this.element.getPosition()[this.axis] - this.half;
Mocht er toevallig iemand een slide bar gaan plaatsen in een element welke te verslepen is, ofwel de positie van het element kan veranderen. Dan vertoond de slider functie een raar effect.
Zodra je op de slide bar knop klikt, verplaatst deze zich onder je muis vandaan en komt weer terug zodra je de muis vast houd en dan zou bewegen.
Dat is dan al gauw een schoonheid foutje in je ontwerp, maar de oplossing ligt
hem erin om de mootools.js bestand even aan te passen op regel 4533 (als je alles hebt gedownload) maar in ieder geval bij de functie:
clickedElement:
en dan regel :
var position = event.page[this.axis] - this.element.getRelativePosition()[this.axis] - this.half;
vervangen met :
var position = event.page[this.axis] - this.element.getPosition()[this.axis] - this.half;
0 -0
-0
ben ik nou de enige die hier niets van snapt? ik krijg het niet aan de praat..
dit is mijn html code:
In mootools.js zit het downloadbestand van mootools.net en in mootest.js staat:
precies zoals het voorbeeld lijkt me...
wat doe ik verkeerd??
dit is mijn html code:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Moo tie het nou?</title>
<script type="text/javascript" src="mootools.js"> </script>
<script type="text/javascript" src="mootest.js"> </script>
</head>
<body>
<p>
<a id="klik" href="#">Klik</a>
</p>
<p id="normaal">
Dit is een normale tekst.
</p>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Moo tie het nou?</title>
<script type="text/javascript" src="mootools.js"> </script>
<script type="text/javascript" src="mootest.js"> </script>
</head>
<body>
<p>
<a id="klik" href="#">Klik</a>
</p>
<p id="normaal">
Dit is een normale tekst.
</p>
</body>
</html>
In mootools.js zit het downloadbestand van mootools.net en in mootest.js staat:
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
// JavaScript Document
window.addEvent('domready', function() {
// en hier gaat dan straks je code komen
// alle javascript-voorbeelden die in deze tutorial staan kunnen hierin komen
$('klik').addEvent('click',function(){
$('normaal').setStyle('color','#990000');
});
});
window.addEvent('domready', function() {
// en hier gaat dan straks je code komen
// alle javascript-voorbeelden die in deze tutorial staan kunnen hierin komen
$('klik').addEvent('click',function(){
$('normaal').setStyle('color','#990000');
});
});
precies zoals het voorbeeld lijkt me...
wat doe ik verkeerd??
0 -0
-0
Het zou gewoon moeten werken, tenminste, als ik het zelf test in firebug. Misschien heb je het pad naar mootools.js en mootest.js niet goed?
En als je in firefox zit, kijk eens bij extra > foutconsole. Krijg je daar een error als je op de link klikt?
Tip: Gebruik firebug en ga dan naar de console en zet daar je stukje javascript in en druk op run. Kijk eens wat er dan gebeurt
En als je in firefox zit, kijk eens bij extra > foutconsole. Krijg je daar een error als je op de link klikt?
Tip: Gebruik firebug en ga dan naar de console en zet daar je stukje javascript in en druk op run. Kijk eens wat er dan gebeurt
0 -0
-0
Dag Harmen (en anderen),
met enige jalouzie lees ik bovenstaande berichten. Ik krijg MooTools niet eens geinstalleerd!
Als ik op download klik verschijnt er een foutmelding, iets met 'navigator is niet gedefinieerd' en 'Runtime-fout Microsoft JSScript'
Wie kan mij adviseren?
Groet, Kees
met enige jalouzie lees ik bovenstaande berichten. Ik krijg MooTools niet eens geinstalleerd!
Als ik op download klik verschijnt er een foutmelding, iets met 'navigator is niet gedefinieerd' en 'Runtime-fout Microsoft JSScript'
Wie kan mij adviseren?
Groet, Kees
0 -0
-0
Je moet een JS bestand nooit direct openen, windows ziet dit als een uitvoerbaar bestand maar kan er maar bar weinig mee.
Je kunt twee dingen doen, of gewoon op je schijf opslaan en daarna openen met kladblok, of je veranderd het zo dat een JS bestand standaard wordt geopend door kladblok, notepad++, wordpad, dreamweaver, you name it!
Je kunt twee dingen doen, of gewoon op je schijf opslaan en daarna openen met kladblok, of je veranderd het zo dat een JS bestand standaard wordt geopend door kladblok, notepad++, wordpad, dreamweaver, you name it!
0 -0
-0
Hallo,
ik zie dat het een js bestand betreft. Maar dit is voor mij toch onbekend. Wat is een js bestand? Ik doe 'intuitief' wat ik altijd doe bij downloaden, namelijk een 'download' aanklikken en dan wachten op de dingen die komen gaan, en dat is dus die foutmelding. Dus 'gewoon' op mijn schijf opslaan krijg ik helaas niet voor elkaar. Volgens mij doe ik iets fout, of ik doe iets niet wat wel moet gebeuren.
Ik ontwerp al 1 jaar websites, heb dus wel enige ervaring met allerlei soorten van bestanden, scripts, enzovoorts, maar dit heb ik nog niet meegemaakt.
groet, Kees
ik zie dat het een js bestand betreft. Maar dit is voor mij toch onbekend. Wat is een js bestand? Ik doe 'intuitief' wat ik altijd doe bij downloaden, namelijk een 'download' aanklikken en dan wachten op de dingen die komen gaan, en dat is dus die foutmelding. Dus 'gewoon' op mijn schijf opslaan krijg ik helaas niet voor elkaar. Volgens mij doe ik iets fout, of ik doe iets niet wat wel moet gebeuren.
Ik ontwerp al 1 jaar websites, heb dus wel enige ervaring met allerlei soorten van bestanden, scripts, enzovoorts, maar dit heb ik nog niet meegemaakt.
groet, Kees
0 -0
-0
kun je niet rechtermuisknop en dan opslaan als ofzoiets??
En anders zul je toch wat anders dan IE moeten instaleren.(ik neem aan dat je IE hebt door je foutmelding ?)
Het gaat er dus om dat IE in dit geval probeert het bestand te openen in plaats van op te slaan.
En anders zul je toch wat anders dan IE moeten instaleren.(ik neem aan dat je IE hebt door je foutmelding ?)
Het gaat er dus om dat IE in dit geval probeert het bestand te openen in plaats van op te slaan.
0 -0
-0
Doe je niet toevallig opslaan op schijf > openen (dit kan namelijk problematisch zijn).
Een .js bestand is een javascript bestand. Overigens, mocht je er tegenaan blijven lopen, open even een topic op het forum, deze reacties zijn niet voor dit soort berichten.
Een .js bestand is een javascript bestand. Overigens, mocht je er tegenaan blijven lopen, open even een topic op het forum, deze reacties zijn niet voor dit soort berichten.
0 -0
-0
Weet iemand toevallig hoe je iets update zonder dat je daarvoor ergens op moet klikken?
0 -0
-0
Gewoon dit in je source zetten:
<script type="text/javascript">
updateFunctie();
</script>
<script type="text/javascript">
updateFunctie();
</script>
0 -0
-0
is het mogenlijk om met mootools, met ajax, de tekst in een string te zetten,en niet meteen in een object zetten?
0 -0
-0
Weet iemand of je ImageMenu van Mootools kunt combineren met Milkbox van Mootools.
Ik krijg het niet aan het werk, ImageMenu werkt wel maar de foto?s die Milkbox moet openen, worden in een nieuw venster geopend.Het is net alsof het pad naar het javascript van Milkbox niet gevonden wordt.Ik heb al alles geprobeerd maar ik krijg het niet werkend.
Graag info voor een oplossing.
Groet Pieter
Ik krijg het niet aan het werk, ImageMenu werkt wel maar de foto?s die Milkbox moet openen, worden in een nieuw venster geopend.Het is net alsof het pad naar het javascript van Milkbox niet gevonden wordt.Ik heb al alles geprobeerd maar ik krijg het niet werkend.
Graag info voor een oplossing.
Groet Pieter
Om te reageren heb je een account nodig en je moet ingelogd zijn.
Inhoudsopgave
- Wat kun je met mootools?
- Mootools “installeren”
- Elementen selecteren
- Voorbeeld 1: Tabs in mootools
- Voorbeeld 2: Coole effecten in mootools
- Mootools en Ajax
- Iets gaan doen met de elementen
- Voorbeeld 3 en handige links
PHP hulp
0 seconden vanaf nu