Menu effect - volgt muis

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Zie Foto

Zie Foto

27/03/2013 15:20:10
Quote Anchor link
Momenteel heb ik een menu, daaronder heb ik een pijltje en de bedoeling is dat het pijltje je muis volgt als je over de navigatie gaat.

Een beetje zoals onderstaande website, maar de bedoeling is dat het "mee schuift" en niet blokje per blokje weergeeft.
Greencircleshoppingcenter.com

Wie kan me hiermee helpen? Hoe kan ik dit opzoeken?
Gewijzigd op 27/03/2013 15:20:34 door Zie Foto
 
PHP hulp

PHP hulp

19/10/2019 18:13:37
 
Joni Fleischer
Moderator

Joni Fleischer

27/03/2013 15:28:05
Quote Anchor link
Hoe is je menu opgebouwd?

Is er een online voorbeeld van wat je nu hebt?
Gewijzigd op 27/03/2013 15:30:51 door Joni Fleischer
 
Zie Foto

Zie Foto

27/03/2013 15:37:30
Quote Anchor link
Op .. http://jsbin.com/uqehut/1 mijn menu.
Op .. http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/ .. Onderaan staat het voorbeeld dat ik graag zou willen bekomen.
Gewijzigd op 27/03/2013 15:48:42 door Zie Foto
 
Wouter J

Wouter J

27/03/2013 15:52:55
Quote Anchor link
Nou, op die link die je geeft staat toch een hele uitleg hoe je jQuery lavalamp kunt gebruiken op je website?
 
Zie Foto

Zie Foto

27/03/2013 15:56:06
Quote Anchor link
Heej Wouter.
Ja onderaan staat een ZIP mapje.. Ga het straks even bekijken


Toevoeging op 27/03/2013 16:56:24:

Hmm.. Met een lijntje lukt het maar met mijn driehoekje niet :(

Toevoeging op 27/03/2013 18:06:06:

Zoals op deze website
http://www.spiralsgym.com.previewdns.com/
Dit zou ik graag willen maken
 
Jack Maessen

Jack Maessen

27/03/2013 22:24:26
Quote Anchor link
gemaakt op basis van die lavalamp script
kopieer de bron maar
Voorbeeld
 
Zie Foto

Zie Foto

28/03/2013 18:08:33
Quote Anchor link
Oh, geweldig Jack, het is gelukt!
Enige probleem.. Mijn links werken nu niet meer :p
 
Jack Maessen

Jack Maessen

28/03/2013 18:50:55
Quote Anchor link
hoe heb je het nu staan dan? post even html code
 
Zie Foto

Zie Foto

28/03/2013 19:04:34
Quote Anchor link
Gewoon de dummy-links aangepast...
http://users.skynet.be/fb089598/pijltje/index.html
 
Jack Maessen

Jack Maessen

28/03/2013 19:25:05
Quote Anchor link
in je javascriptje:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
$(function() {
            $("#1").lavaLamp({
                fx: "backout",
                speed: 700,
                click: function(event, menuItem) {
                    return false;
                }
            });
        });

false vervangen door true
Gewijzigd op 28/03/2013 19:27:34 door Jack Maessen
 
Zie Foto

Zie Foto

28/03/2013 19:50:53
Quote Anchor link
Werkt nu wel (y)

Misschien nog een klein schoonheidsfoutje.
Als je naar "pagina 1" ofzo gaat springt het pijltje terug bij "Home"..
Zou natuurlijk mooier zijn moest het pijltje staan, op welke pagina je nu zit, als je er natuurlijk niet over beweegt.
 
Jack Maessen

Jack Maessen

28/03/2013 23:32:21
Quote Anchor link
Dan geef je de list een current classe mee
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
<ul class="lavaLampWithImage" id="1">
    <li><a href="#">Home</a></li>
    <li class="current"><a href="a.html">Plant a tree</a></li>
     <li><a href="b.html">Travel</a></li>
    <li><a href="c.html">Ride an elephant</a></li>
</ul>

In bovenstaande staat pijltje onder "Plant a tree"; en dat is a.html in mijn voorbeeld
 



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.