Jak zrobić wysuwane menu podobne do tego na tej stronie
http://graffika.pl/viewforum.php?f=77
Nie chodzi mi o sam skrypt tylko jak zrobić to żeby ta zakładka w menu wysuwała się wolniej(tak jak na tej stronie) a nie tak od razu po najechaniu
Kursy Programowania i Tworzenia stron WWW
Forum programowania i tworzenia stron WWW na podstawie video kursów ze strony videokurs.pl
Wysuwane menu
Posty: 11
• Strona 1 z 2 • 1, 2
Wysuwane menu
przez bielu000 » sobota, 9 kwietnia 2011, 18:09
- bielu000
- Bywalec
- Posty: 56
- Dołączył(a): piątek, 8 maja 2009, 14:54
Re: Wysuwane menu
przez Lenson » sobota, 9 kwietnia 2011, 18:25
Z tego co sobie przypominam mozna to chyba normalnie w stylach ustawić, opóźnienie chyba w którymś kursie sie juz z tym spotkałem, ale pytanien dalej do naszego wodza p. Arka xD
- Lenson
- Bywalec
- Posty: 67
- Dołączył(a): piątek, 25 lutego 2011, 01:41
Re: Wysuwane menu
przez Morfidon » sobota, 9 kwietnia 2011, 21:28
Dajesz firebug na ten element i od razu widzisz, że jest sobie coś takiego:
http://graffika.pl/styles/graffika/them ... enu-bg.png
czyli pełna grafika. Prawdopodobnie z-index tej grafiki jest niższy niż tego elementu brązowego, po najechaniu na "zakładkę" zmieniasz ułożenie względem pionu przy pomocy jQuery.
http://graffika.pl/styles/graffika/them ... enu-bg.png
czyli pełna grafika. Prawdopodobnie z-index tej grafiki jest niższy niż tego elementu brązowego, po najechaniu na "zakładkę" zmieniasz ułożenie względem pionu przy pomocy jQuery.
- Morfidon
- Administrator
- Posty: 593
- Dołączył(a): wtorek, 5 sierpnia 2008, 21:48
Re: Wysuwane menu
przez bielu000 » sobota, 9 kwietnia 2011, 22:30
Nie da sie tego jakos inaczej zrobić ? Nie przy pomocy jQuery nie wiem moze JS ?
- bielu000
- Bywalec
- Posty: 56
- Dołączył(a): piątek, 8 maja 2009, 14:54
Re: Wysuwane menu
przez Morfidon » sobota, 9 kwietnia 2011, 23:30
jQuery to biblioteka JS 
możesz sobie sam napisać to co jest w jQuery, ale będzie trudniej i zajmie to więcej czasu
możesz sobie sam napisać to co jest w jQuery, ale będzie trudniej i zajmie to więcej czasu - Morfidon
- Administrator
- Posty: 593
- Dołączył(a): wtorek, 5 sierpnia 2008, 21:48
Re: Wysuwane menu
przez bielu000 » sobota, 9 kwietnia 2011, 23:49
Dobra mam taki dokument
działa ta funkcja ale tylklo do pierwszego diva a chciałbym żeby działał także do innych divów co tu trzeba zmienic ?
//Dodatkowo nie działa w Explolerze
- Kod: Zaznacz cały
<html>
<head>
<title>jQuery - próba</title>
<script type="text/javascript" src="jquery-1.2.3.js"></script>
<link rel="Stylesheet" type="text/css" href="style.css">
<script>
$(document).ready(function() {
$('#pierwszy').click(function() {
$(this).css('color', 'red').hide('slow').show(3000); ;
});
$('a.link').click(function() {
alert($(this).attr('href'))
return false;
})
$("#balonik_stop")
.mouseover(function(){
$(this).stop().animate({height:300}, 500);
})
.mouseout(function(){
$(this).stop().animate({height:100}, 500);
});
});
</script>
</head>
<body>
<p>
<div id="balonik_stop" class="z_balonikiem">
Najedź na mnie
</div>
</p>
<p>
<div id="balonik_stop" class="z_balonikiem">
Najedź na mnie
</div>
</p>
</body>
</html>
działa ta funkcja ale tylklo do pierwszego diva a chciałbym żeby działał także do innych divów co tu trzeba zmienic ?
//Dodatkowo nie działa w Explolerze
- bielu000
- Bywalec
- Posty: 56
- Dołączył(a): piątek, 8 maja 2009, 14:54
Re: Wysuwane menu
przez Lenson » niedziela, 10 kwietnia 2011, 00:21
A nie dało by rade tego na patęcie zrobić i przy pomocy pętli w php zwiekszac po prostu co pętle wysokość elementu ? ^^ z opoznieniem jakims tam ?
- Lenson
- Bywalec
- Posty: 67
- Dołączył(a): piątek, 25 lutego 2011, 01:41
Re: Wysuwane menu
przez bielu000 » niedziela, 10 kwietnia 2011, 00:25
Jak chcesz to zrobic w php zeby bylo dynaczmicznie ? To ma byc po najechaniu myszka na odnosnik a nie wiem czy w php mozna cos takiego zrobic
- bielu000
- Bywalec
- Posty: 56
- Dołączył(a): piątek, 8 maja 2009, 14:54
Re: Wysuwane menu
przez Morfidon » niedziela, 10 kwietnia 2011, 11:00
Użyj klasy, a nie identyfikatora (także w zapytaniu jQuery). Mówiłem w video kursie xhtml i css, że identyfikator jest unikalny i powinien być na stronie tylko JEDEN. Z tego powodu wybierając w jQuery po identyfikatorze, może się zdarzyć, że nie wybierze ich wszystkich, bo powinien być tylko jeden.
- Morfidon
- Administrator
- Posty: 593
- Dołączył(a): wtorek, 5 sierpnia 2008, 21:48
Re: Wysuwane menu
przez bielu000 » niedziela, 10 kwietnia 2011, 12:18
No tak faktycznie zapomnialem o tym, teraz po zmianie na klase działa...ale IE dalej mnie ignoruje i nie chce wprawić diva w ruch.
Dodaje pełny kod:
i jeszcze style.css
Dodaje pełny kod:
- Kod: Zaznacz cały
<html>
<head>
<title>jQuery - próba</title>
<script type="text/javascript" src="jquery-1.2.3.js"></script>
<link rel="Stylesheet" type="text/css" href="style.css">
<script type="text/javascript">
$(document).ready(function() {
$(".balonik_stop")
.mouseover(function(){
$(this).stop().animate({height:300}, 500);
})
.mouseout(function(){
$(this).stop().animate({height:100}, 500);
});
});
</script>
</head>
<body>
<p>
<div class="balonik_stop">
Najedź na mnie
</div>
</p>
<p>
<div <div class="balonik_stop">
Najedź na mnie 1
</div>
</p>
</body>
</html>
i jeszcze style.css
- Kod: Zaznacz cały
.page_hover_box {
padding:5px;
position:fixed;
right:-250px;
top:125px;
background:#687BC3;
overflow:hidden;
width:300px;
height:150px;
z-index:9999;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-border-radius:5px;
-moz-box-shadow:0 1px 2px #333;
-webkit-box-shadow:0 1px 2px #333;
-box-shadow:0 1px 2px #333;
}
.balonik_stop {
width:200px;
height:30px;
text-align:left;
padding:10px;
font:bold 12px Tahoma;
color:#678CB1; border:2px solid #678CB1;
line-height:30px; background:#9DB2C9;
position:relative;
}
#div2 {
background-color: red;
width: 100px;
height: 100px;
}
- bielu000
- Bywalec
- Posty: 56
- Dołączył(a): piątek, 8 maja 2009, 14:54
Posty: 11
• Strona 1 z 2 • 1, 2
Kto przegląda forum
Użytkownicy przeglądający ten dział: Brak zidentyfikowanych użytkowników i 1 gość
