javascript slider

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Jer Tie

Jer Tie

01/10/2009 11:12:00
Quote Anchor link
Ik heb een scriptje geschreven voor het op en dicht klappen van Div's.
Ik heb dit scriptje geschreven:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<script language="JavaScript">
    


function doSizeUp_1() {
    var foo = document.getElementById('content_1');
    var curr_width=parseInt(foo.style.width);
    var max_width=500;
    
    if( curr_width <= max_width){
        foo.style.width = (curr_width + 10)+'px'; // pseudo-property code: Move right by 10px
        setTimeout(doSizeUp_1,10); // call doMove() in 20 msec
    };
    
}

function doSizeDown_1() {
    var foo = document.getElementById('content_1');
    var curr_width=parseInt(foo.style.width);
    var min_width=0;
    
    if( curr_width >= min_width){
        foo.style.width = (curr_width - 10)+'px'; // pseudo-property code: Move right by 10px
        setTimeout(doSizeDown_1,10); // call doMove() in 20 msec
    };
}

function doSizeUp_2() {
    var foo = document.getElementById('content_2');
    var curr_width=parseInt(foo.style.width);
    var max_width=500;
    
    if( curr_width <= max_width){
        foo.style.width = (curr_width + 10)+'px'; // pseudo-property code: Move right by 10px
        setTimeout(doSizeUp_2,10); // call doMove() in 20 msec
    };
}

</script>
<body>




    <div id="cat_1" onclick="doSizeUp_1()">1</div>
        <div id="content_1" style="width:0px;">Dit is content van div 1
        </div>
    
    <div id="cat_2" onclick="doSizeDown_1()" >2</div>
        <div id="content_2" style="width:0px;">Dit is content van div 2</div>
    
    <div id="cat_3">3</div>
        <div id="content_3">Dit is content van div 3</div>

</body>
</html>


Als ik op 1 klik, gaat ie open, klik op twee gaat ie dicht. Tot zo ver netjes
Maar klik ik dan weer op 1 om te openen, dan lijken twee scripts elkaar tegen te werken.
Hij gaat iets open en je zit m steeds heen en weer gaan alsof het open en dicht script tegen elkaar vechten... iemand een idee hoe ddat komt??

Alvast bedankt!
 
PHP hulp

PHP hulp

21/06/2024 19:17:53
 
Richard van Velzen

Richard van Velzen

01/10/2009 11:31:00
Quote Anchor link
De breedte wordt nooit kleiner dan 1px, dus je curr_width >= min_width zal altijd true geven.
 
Joey Drieling

Joey Drieling

01/10/2009 11:36:00
Quote Anchor link
Waarom het wiel opnieuw uitvinden.

Gebruik anders gewoon een framework bijvoorbeeld Mootools!

Dat scheeld je veel moeite en gekut met javascripts die niet werken.
 
Toine vd P

Toine vd P

01/10/2009 11:47:00
Quote Anchor link
@joey, ben ik niet met je eens. Zorg er altijd voor dat je alles wat je van internet "gapt" zelf een keer hebt gemaakt. Als dat gebeurd is ben ik het met je eens "niet opnieuw het wiel uitvinden".
 
Jer Tie

Jer Tie

01/10/2009 12:11:00
Quote Anchor link
Bedankt voor jullie reacties!

@joey Ik hou er van te weten hoe de scripts werken. Ik ben beizg javascript goed onder knie te krijgen, en daar was dit een onderdeel van.

Nogmaals bedankt!
 
Richard van Velzen

Richard van Velzen

01/10/2009 13:50:00
Quote Anchor link
Als je JavaScript goed onder de knie wil krijgen raad ik je aan om presentatie van Douglas Crockford over The Good Parts eens te kijken, heel erg interessant.

http://www.youtube.com/watch?v=hQVTIJBZook
 
Joey Drieling

Joey Drieling

02/10/2009 15:12:00
Quote Anchor link
Uiteraard leer je heel goed door het eerst eens zelf te maken, maar als je wat gevordert bent vind ik het overbodig om alles over te makken.
Wand als je naar een script kijkt en je kan meteen zien wat het doet en hoe het werkt, dan vind ik het niet nodig.

Dacht dat de mensen hier het wel begreepen maar blijkbaar hebbensomigen meer tekstnodig
Van daar ik hier effe duidelijk mijn verhaal doe.
Gewijzigd op 01/01/1970 01:00:00 door Joey Drieling
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.