Neko

Vízszintes menük

Vízszintes menük : Vízszintes menü 18.

Vízszintes menü 18.

Főoldal Grafika Segítségek Kódok Galéria

Leírás

Ez a menü akkor mutat a legjobban, ha a szerkeszthető fejlécbe teszed bele. Vagy is, ajánlott a kódot oda tenni!
Mivel maga a kód táblázatban van, így még több cellát is létrehozhatsz benne, ha esetleg van olyan információd, amit szeretnél mindig aktívnak tudni. A kódokat egymás alá illeszd be, úgy, ahogy itt van nálam. A CSS kódban írd át a színeket, betűtípust, stb. A képeket cseréld le a sajátodra, de nem muszáj. Okézd le és készen is vagy

Két fontos információ

A kódot én készítettem, kivéve a javascript részét, mert azt a neten találtam. De maga a menü saját!
A kód működik. Nem rossz, nincs benne semmi hiba. Ha nálad nem működik, akkor valamit elrontottál. Kihagytál egy kódrészt, vagy a CSS átírása közben történt valami baki. A lényeg, hogy ami itt van kód, az jó.

Menü kódja

<div class="nav">
   <table align="center" height="50" width="640">
       <tbody>
           <tr>
               <td align="left">
                   <a class="cssmenu" href="//aranymeli.gportal.hu">Főoldal</a> <a class="cssmenu" href="//aranymeli.gportal.hu/gindex.php?pg=19322271">Grafika</a> <a class="cssmenu" href="//aranymeli.gportal.hu/gindex.php?pg=20199690">Segítségek</a> <a class="cssmenu" href="//aranymeli.gportal.hu/gindex.php?pg=18012139">Kódok</a> <a class="cssmenu" href="http://www.linda.weboldala.net/" target="_blank">Galéria</a></td>
               <td align="center">
                   <a href="http://www.aranymeli.hu"><img alt="" src="//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1376229577_75.gif" style="width: 32px; height: 32px;" /></a> <a href="https://www.facebook.com/lindadesign.gportal" target="_blank"><img alt="" src="//aranymeli.gportal.hu/portal/aranymeli/image/gallery/1367662327_23.png" style="width: 32px; height: 32px;" /></a></td>
           </tr>
       </tbody>
   </table>
</div>

CSS kódja

   <style type="text/css">
.nav {
   padding: 0;
   background-color: #3C3E50; /* a sáv háttérszíne */
   position: -webkit-sticky;
   z-index: 1;
        text-align: center;
   color: #fff; /* ha csak simán szöveget is írsz bele, akkor ez a szöveg színe */
}
.sticky { /* ezt NEM bántjuk! */
   position: fixed;
   width: 100%;
   left: 0;
   top: 0;
   z-index: 100;
}
a.cssmenu { /* menü kinézete */
    color: #F3F2F0 !important;
    padding: 10px;
    margin: 10px;
    font-size: 14px !important;
    font-family: georgia !important;
    background-color: transparent !important;}
a.cssmenu:hover { /* menü kinézete, ha ráviszed az egeret */
    text-decoration: underline;
}
-->   </style>

Javascipt kódok
A javascript kódokat nem kell bántani, csak úgy ahogy itt van illeszd be oda, ahol a menü is lesz!

stickyNav();
			// and run it again every time you scroll
			$(window).scroll(function() {
				stickyNav();
			});
		});
	</script><script type="text/javascript">
(function(a){a.isScrollToFixed=function(b){return a(b).data("ScrollToFixed")!==undefined};a.ScrollToFixed=function(d,g){var j=this;j.$el=a(d);j.el=d;j.$el.data("ScrollToFixed",j);var c=false;var z=j.$el;var A;var x=0;var n=0;var h=-1;var e=-1;var p=null;var u;function q(){z.trigger("preUnfixed");i();z.trigger("unfixed");e=-1;x=z.offset().top;n=z.offset().left;if(j.options.offsets){n+=(z.offset().left-z.position().left)}if(h==-1){h=n}A=z.css("position");c=true;if(j.options.bottom!=-1){z.trigger("preFixed");s();z.trigger("fixed")}}function k(){var B=j.options.limit;if(!B){return 0}if(typeof(B)==="function"){return B()}return B}function m(){return A==="fixed"}function t(){return A==="absolute"}function f(){return !(m()||t())}function s(){if(!m()){p.css({display:z.css("display"),width:z.outerWidth(true),height:z.outerHeight(true),"float":z.css("float")});z.css({width:z.width(),position:"fixed",top:j.options.bottom==-1?o():"",bottom:j.options.bottom==-1?"":j.options.bottom});A="fixed"}}function b(){z.css({width:z.width(),position:"absolute",top:k(),left:n});A="absolute"}function i(){if(!f()){e=-1;p.css("display","none");z.css({width:"",position:"",left:"",top:""});A=null}}function r(B){if(B!=e){z.css("left",n-B);e=B}}function o(){return j.options.marginTop}function v(){if(!a.isScrollToFixed(z)){return}var D=c;if(!c){q()}var B=a(window).scrollLeft();var E=a(window).scrollTop();var C=k();if(j.options.minWidth&&a(window).width()<j.options.minWidth){if(!f()||!D){l();z.trigger("preUnfixed");i();z.trigger("unfixed")}}else{if(j.options.bottom==-1){if(C>0&&E>=C-o()){if(!t()||!D){l();z.trigger("preAbsolute");b();z.trigger("unfixed")}}else{if(E>=x-o()){if(!m()||!D){l();z.trigger("preFixed");s();e=-1;z.trigger("fixed")}r(B)}else{if(!f()||!D){l();z.trigger("preUnfixed");i();z.trigger("unfixed")}}}}else{if(C>0){if(E+a(window).height()-z.outerHeight(true)>=C-o()){if(m()){l();z.trigger("preUnfixed");i();z.trigger("unfixed")}}else{if(!m()){l();z.trigger("preFixed");s()}r(B);z.trigger("fixed")}}else{r(B)}}}}function l(){var B=z.css("position");if(B=="absolute"){z.trigger("postAbsolute")}else{if(B=="fixed"){z.trigger("postFixed")}else{z.trigger("postUnfixed")}}}var w=function(B){if(z.is(":visible")){c=false;v()}};var y=function(B){v()};j.init=function(){j.options=a.extend({},a.ScrollToFixed.defaultOptions,g);if(navigator.platform==="iPad"||navigator.platform==="iPhone"||navigator.platform==="iPod"){if(!navigator.userAgent.match(/OS 5_.*\ like Mac OS X/i)){return}}j.$el.css("z-index",j.options.zIndex);p=a("<div />");A=z.css("position");if(f()){j.$el.after(p)}a(window).bind("resize.ScrollToFixed",w);a(window).bind("scroll.ScrollToFixed",y);if(j.options.preFixed){z.bind("preFixed.ScrollToFixed",j.options.preFixed)}if(j.options.postFixed){z.bind("postFixed.ScrollToFixed",j.options.postFixed)}if(j.options.preUnfixed){z.bind("preUnfixed.ScrollToFixed",j.options.preUnfixed)}if(j.options.postUnfixed){z.bind("postUnfixed.ScrollToFixed",j.options.postUnfixed)}if(j.options.preAbsolute){z.bind("preAbsolute.ScrollToFixed",j.options.preAbsolute)}if(j.options.postAbsolute){z.bind("postAbsolute.ScrollToFixed",j.options.postAbsolute)}if(j.options.fixed){z.bind("fixed.ScrollToFixed",j.options.fixed)}if(j.options.unfixed){z.bind("unfixed.ScrollToFixed",j.options.unfixed)}if(j.options.spacerClass){p.addClass(j.options.spacerClass)}z.bind("resize.ScrollToFixed",function(){p.height(z.height())});z.bind("scroll.ScrollToFixed",function(){z.trigger("preUnfixed");i();z.trigger("unfixed");v()});z.bind("remove.ScrollToFixed",function(){z.trigger("preUnfixed");i();z.trigger("unfixed");a(window).unbind("resize.ScrollToFixed",w);a(window).unbind("scroll.ScrollToFixed",y);z.unbind(".ScrollToFixed");j.$el.removeData("ScrollToFixed")});w()};j.init()};a.ScrollToFixed.defaultOptions={marginTop:0,limit:0,bottom:-1,zIndex:1000};a.fn.scrollToFixed=function(b){return this.each(function(){(new a.ScrollToFixed(this,b))})}})(jQuery);</script>

Súgó

Még nincs hozzászólás.

Frissítés

Csak regisztrált felhasználók írhatnak hozzászólást.

Oldal tetejére

Dryvit, hõszigetelés! Vállaljuk családi házak, nyaralók és egyéb épületek homlokzati szigetelését! 0630/583-3168 Hívjon! ***** A legfrissebb hírek a Super Mario világából és a legteljesebb adatbázis a Mario játékokról.Folyamatosan bõvülõ tartalom. ***** Gigágá! Márton napján is gyertek a Mesetárba! Nemcsak libát, de kacsát is kaptok! Játsszatok velünk! ***** A Nintendo a Nintendo Music-kal megint valami kiváló dolgot hozott létre! Alaposan nagyító alá vettem, az eredmény itt. ***** Leanderek, Parfümök, Olajok, és Szépségápolási termékek! Használd a LEVI10 kupont és kapj 10% kedvezményt!Megnyitottunk ***** Megjelent a Nintendo saját gyártású órája, a Nintendo Sound Clock Alarmo! Ha kíváncsi vagy, mit tud, itt olvashatsz róla ***** Megnyílt a webáruházunk! Parfümök, Szépségápolási termékek, Olajok mind egy helyen! Nyitási akciók, siess mert limitált! ***** Az általam legjobbnak vélt sportanimék listája itt olvasható. Top 10 Sportanime az Anime Odyssey-n! ***** Pont ITT Pont MOST! Pont NEKED! Már fejlesztés alatt is szebbnél szebb képek! Ha gondolod gyere less be! ***** Megnyílt a webáruházunk! NYITÁSI AKCIÓK! Tusfürdõ+Fogkrém+Sampon+Izzadásgátló+multifunkcionális balzsam most csak 4.490! ***** Új mese a Mesetárban! Téged is vár, gyere bátran! ***** Veterán anime rajongók egyik kedvence a Vadmacska kommandó. Retrospektív cikket olvashatsz róla az Anime Odyssey blogban ***** Parfümök, Olajok, Párologtatók mind egy weboldalon! Siess mert nyitási AKCIÓNK nem sokáig tart! Nagy kedvezmények várnak ***** Dryvit, hõszigetelés! Vállaljuk családi házak, nyaralók és egyéb épületek homlokzati szigetelését! 0630/583-3168 Hívjon! ***** Aki érdeklõdik a horoszkópja után, az nem kíváncsi, hanem intelligens. Rendeld meg most és én segítek az értelmezésben! ***** A Múzsa, egy gruppi élményei a színfalak mögött + napi agymenések és bölcseletek ***** KARATE OKTATÁS *** kicsiknek és nagyoknak *** Budapest I. II. XII.kerületekben +36 70 779-55-77 ***** Augusztus 26-án Kutyák Világnapja! Gyertek a Mesetárba, és ünnepeljétek kutyás színezõkkel! Vau-vau! ***** A horoszkóp elemzésed utáni érdeklõdés, nem kíváncsiság hanem intelligencia. Rendeld meg és nem fogod megbánni. Katt!!! ***** Cikksorozatba kezdtem a PlayStation történelmérõl. Miért indult nehezen a Sony karrierje a konzoliparban?