Probleem met jquery menu

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Pagina: 1 2 volgende »

Thomas R

Thomas R

03/05/2012 16:24:34
Quote Anchor link
Hallo allemaal,

ik ben laatst begonnen met een mobiele versie van mijn website.
Dit begon goed en ik had een mooie layout opgezet, maar toen ging jquery me irriteren. Ik heb toen jquery gebruikt voor een (van links naar rechts schuivend) menu. In IE doet hij het prima, maar in Google Chrome en op mijn mobiel wil het menu maar niet tevoorschijn komen.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
<script>
$(document).ready(function() {
    $('.toggle').live("click", function(){
        $('#menu').animate({marginLeft: '0'}, 500);
        $('.toggle').removeClass('toggle').addClass('toggle2');
    });

    $('.toggle2').live("click", function(){
        $('#menu').animate({marginLeft: '-65'}, 500);
        $('.toggle2').removeClass('toggle2').addClass('toggle');
    });    
});
</script>


De rest van de index code kun je van de pagina afhalen: http://m.smash.nl

Iemand oplossingen??
 
PHP hulp

PHP hulp

28/03/2024 18:52:51
 
Jurgen B

Jurgen B

03/05/2012 16:29:28
Quote Anchor link
Ten eerste zou ik live() vervangen door on(), zie ook jQuery API. Daarnaast staat er in je menu_toggle div een onclick die incompleet/leeg is, haal die ook eens weg.
 
Jeroen VD

Jeroen VD

03/05/2012 16:29:56
Quote Anchor link
probeer dit eens:
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
<script>
$(document).ready(function() {
    var menu = $('#menu'),
        toggle = $('.toggle');
    toggle.on("click", function(){
        menu.animate({margin-left: '0'}, 500);
        toggle.removeClass('toggle').addClass('toggle2');
    });

    var toggle2 = $('.toggle2');
    toggle2.on("click", function(){
        menu.animate({margin-left: -65'}, 500);
        toggle2.removeClass('toggle2').addClass('toggle');
    });    
});
</script>
Gewijzigd op 03/05/2012 16:36:06 door Jeroen VD
 
Thomas R

Thomas R

03/05/2012 16:32:12
Quote Anchor link
@Jurgen B, die lege onclick staat er omdat dit iets van een fix was waarover ik gelezen had. Kan ook niet kloppen hoor. Zal beide suggesties eens proberen.

Toevoeging op 03/05/2012 16:33:14:

@Jurgen B, je suggestie werkte niet, nu reageert hij in IE ook al niet meer.
 
Jeroen VD

Jeroen VD

03/05/2012 16:33:52
Quote Anchor link
je bedoelt mij?
javascript console? foutmeldingen?
 
Thomas R

Thomas R

03/05/2012 16:35:15
Quote Anchor link
@Jeroen vd, helaas werkte jouw suggestie ook al niet.. Reageert niet meer, net als bij Jeroens oplossing.
 
Jeroen VD

Jeroen VD

03/05/2012 16:35:44
Quote Anchor link
klein aanpassingkje, probeer die eens

Toevoeging op 03/05/2012 16:36:40:

en hou de namen eens in de gaten, ik heet jeroen, en jurgen heet jurgen
 
Thomas R

Thomas R

03/05/2012 16:38:51
Quote Anchor link
Nee, jammer genoeg werkt dit ook niet. Volgens mij moet ik wel echt .live() gebruiken, anders werkt hij sowieso niet.
 
Jurgen B

Jurgen B

03/05/2012 16:39:05
Quote Anchor link
Er mist een ' bij de -65, zet die eens terug, dan zou hij weer moeten werken ;)

Mbt live() :
As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().

Zie ook http://api.jquery.com/live/

Ik zie ook dat je margin-left probeert, dat kan wel maar dan moet je hem eveneens tussen haakjes zetten.
Gewijzigd op 03/05/2012 16:41:01 door Jurgen B
 
Thomas R

Thomas R

03/05/2012 16:41:14
Quote Anchor link
Aangepast, zag de fout niet, maar het heeft niks uitgehaald :(
.live() dus niet gebruiken.
 
Jurgen B

Jurgen B

03/05/2012 16:42:26
Quote Anchor link
Zie daarvoor mijn aanpassing, je hebt marginLeft naar margin-left aangepast, dat moet dan 'margin-left' zijn of gewoon weer marginLeft.
 
Jeroen VD

Jeroen VD

03/05/2012 16:42:37
Quote Anchor link
wat zegt de javascript console?! als je daar eens naar kijkt
 
Thomas R

Thomas R

03/05/2012 16:42:51
Quote Anchor link
Wat bedoel je met die margin-left tussen haakjes zetten?
 
Wouter J

Wouter J

03/05/2012 16:43:00
Quote Anchor link
Thomas, heb je wel jQuery 1.7.x ingeladen?
 
Thomas R

Thomas R

03/05/2012 16:43:18
Quote Anchor link
Hoe kan ik naar de javascript console kijken dan?
 
Henk PHP

Henk PHP

03/05/2012 16:43:55
Quote Anchor link
Wouter J op 03/05/2012 16:43:00:
Thomas, heb je wel jQuery 1.7.x ingeladen?


Volgens de broncode niet:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
Gewijzigd op 03/05/2012 16:44:19 door Henk PHP
 
Thomas R

Thomas R

03/05/2012 16:44:18
Quote Anchor link
@Wouter, nee ik zie nu dat ik dat niet gedaan heb, maar dat is toch niet voor on("click".. maar voor live("click".. ?
 
Jurgen B

Jurgen B

03/05/2012 16:45:07
Quote Anchor link
Ok dus dat moet dan al 1.7 worden, en daarnaast dient er 'margin-left' te staan (dus met die haakjes ipv zonder) voor zover ik weet, OF marginLeft (zonder haakjes in dat geval).

In console staat ook:
Uncaught SyntaxError: Unexpected token -
Dus sowieso met de haakjes.
Gewijzigd op 03/05/2012 16:45:51 door Jurgen B
 
Wouter J

Wouter J

03/05/2012 16:46:13
Quote Anchor link
Simon, bedankt. Maak van die code die simon eens gaf dit:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

Nu gaat het wel werken.
 
Thomas R

Thomas R

03/05/2012 16:48:50
Quote Anchor link
Heb 1.7 ingeladen, was een domme fout van mijzelf.. -.-
In IE doet hij het nu weer wel, ga nu kijken of hij het ook in Chrome en op mijn mobiel doet.
 
Henk PHP

Henk PHP

03/05/2012 16:50:16
Quote Anchor link
Ik kan je aanraden om jsFiddle te gebruiken om dit soort functionaliteit te testen, dan zie je wellicht ook makkelijk met welke library/versie je bezig bent. Maar dit is enkel een suggestie, ik vindt jsFiddle zelf namelijk super handig.
 

Pagina: 1 2 volgende »



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.