Forum'da ara:
Ara


« Önceki başlık :: Sonraki başlık »  
Yazar Mesaj
Mesaj17.08.2012, 00:01 (UTC)    
Mesaj konusu: Menü

Öncelikle yanlış yerse özür dilerim. Moderatörler taşıyabilirse sevinirim.

Bir menüye ihtiyacım var. Yapmaya çalıştım ancak bir türlü beceremedim.
Olmasını istediğim şekli resim olarak gösterdim. Menü alanında ki o gölgelendirilmiş yeri arkaplan olarak kullanacağım. Yani o sayfa ne kadar aşağıya inerse uzayacak. Asıl sorunum;

Üzerine geldiğinde açılan menü yapamadım. Şöyle olursa çok daha iyi olur benim için.
Linklere "tıklandığı zaman" alt sayfaları çıksın istiyorum. Beceremedim gitti.

Ana Sayfa
=>Menü1
=>Menü2
Hakkımızda

İletişim


Şeklinde. 2 menü için yapsanız ben devamını getiririm. Biraz da görsellik önemli yine resimde kine uyumlu olursa sevinirim Smile

Ve lütfen resimlerden oluşmasın. Düzenleyebileyim. Smile

http://d1208.hizliresim.com/10/k/bz6qc.png
Mesaj17.08.2012, 08:52 (UTC)    
Mesaj konusu: slm

bunun için hazır kodlar var onu kullan. kendin yapmana gerek yok.
Mesaj17.08.2012, 09:01 (UTC)    
Mesaj konusu:

Kod:
 <p><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script></p>
<p><script type="text/javascript" src="http://sado.voovq.com/js/ddaccordion.js"></p>
<p><script type="text/javascript" src="http://sado.voovq.com/js/hizli.js"></script></p>
<p><SCRIPT type=text/javascript> </p>
<p>      ddaccordion.init({<br />
         headerclass: "submenuheader", //Shared CSS class name of headers group<br />
         contentclass: "submenu", //Shared CSS class name of contents group<br />
         revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click" or "mouseover<br />
         collapseprev: true, //Collapse previous content (so only one open at any time)? true/false<br />
         defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content<br />
         onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)<br />
         animatedefault: false, //Should contents open by default be animated into view?<br />
         persiststate: true, //persist state of opened contents within browser session?<br />
         toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]<br />
         togglehtml: ["suffix", "<img class="lazy lazy-hidden" src="http://www.webilgim.com/wp-content/plugins/bj-lazy-load/img/placeholder.gif" data-lazy-type="image" data-lazy-src='http://img.webme.com/pic/c/catlak-site55/plus.gif' class='statusicon' /><noscript><img src='http://img.webme.com/pic/c/catlak-site55/plus.gif' class='statusicon' /></noscript>", "<img class="lazy lazy-hidden" src="http://www.webilgim.com/wp-content/plugins/bj-lazy-load/img/placeholder.gif" data-lazy-type="image" data-lazy-src='http://img.webme.com/pic/c/catlak-site55/minus.gif' class='statusicon' /><noscript><img src='http://img.webme.com/pic/c/catlak-site55/minus.gif' class='statusicon' /></noscript>"], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)<br />
         animatespeed: "normal", //speed of animation: "fast", "normal", or "slow"<br />
         oninit:function(headers, expandedindices){ //custom code to run when headers have initalized<br />
            //do nothing<br />
         },<br />
         onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed<br />
            //do nothing<br />
         }<br />
      })</p>
<p>      </SCRIPT>   </p>

Menüyü Koyacağınız Yer:
Kod:
<div class="glossymenu"><a class="menuitem submenuheader" href="http://catlak-site55.tr.gg/#">ANA MENÜ</a></p>
<div class="submenu">
<ul>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
</ul></div>
<p>        <a class="menuitem submenuheader" href="#">BURAYA MENÜ ADI</a></p>
<div class="submenu">
<ul>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
</ul></div>
<p> <a class="menuitem submenuheader" href="#">BURAYA MENÜ ADI</a></p>
<div class="submenu">
<ul>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" title="Fotoğraflar" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
</ul></div>
<p> <a class="menuitem submenuheader" href="#">BURAYA MENÜ ADI</a></p>
<div class="submenu">
<ul>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
<li><a href="BURAYA LİNK" ><b>SAYFA ADI</b></a></li>
</ul></div>
<p>   <a class="menuitem"href="BURAYA LİNK">SAYFA ADI</a><br />
    <a<br />
   <a class="menuitem"href="BURAYA LİNK">SAYFA ADI</a></p>
<p>   <a class="menuitem"href="BURAYA LİNK">SAYFA ADI</a></p></div>

Css Kodu
Kod:

.glossymenu {<br />
   PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; WIDTH: 180px; PADDING-TOP: 0px;<br />
}<br />
.glossymenu A.menuitem {<br />
   PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-SIZE: 12px; BACKGROUND: url(http://img.webme.com/pic/c/catlak-site55/glossyback.jpg) black repeat-x left bottom; PADDING-BOTTOM: 5px; WIDTH: auto; COLOR: #000000; PADDING-TOP: 5px; POSITION: relative; TEXT-DECORATION: none<br />
}<br />
.glossymenu A.menuitem:visited {<br />
   COLOR: #000000<br />
}<br />
.glossymenu .menuitem:active {<br />
   COLOR: #000000<br />
}<br />
.glossymenu A.menuitem .statusicon {<br />
   RIGHT: 5px; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; POSITION: absolute; TOP: 5px; BORDER-BOTTOM-STYLE: none<br />
}<br />
.glossymenu A.menuitem:hover {<br />
   BACKGROUND-IMAGE: url(http://img.webme.com/pic/c/catlak-site55/glossyback2.jpg)<br />
}<br />
.glossymenu DIV.submenu {<br />
   BACKGROUND: white<br />
}<br />
.glossymenu DIV.submenu UL {<br />
   PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none<br />
}<br />
.glossymenu DIV.submenu UL LI {<br />
   BORDER-BOTTOM: #cccccc 1px solid<br />
}<br />
.glossymenu DIV.submenu UL LI A {<br />
   PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-SIZE: 11px; PADDING-BOTTOM: 7px; COLOR: black; PADDING-TOP: 7px; TEXT-DECORATION: none<br />
}<br />
.glossymenu DIV.submenu UL LI A:hover {<br />
   BACKGROUND: #eeeeee; colorz: white<br />
}</p>
<p>

______________
Büyük işler başaran, Küçük adam..
DREAMWEAVER İLE BEDAVA-SİTEM İÇİN TASARIM YAPMA // RESİMLİ ANLATIM
Mesaj17.08.2012, 09:02 (UTC)    
Mesaj konusu: slm

sağolasın kardeş
Mesaj17.08.2012, 10:36 (UTC)    
Mesaj konusu: Re: slm

bilgicedunyam yazmış:
bunun için hazır kodlar var onu kullan. kendin yapmana gerek yok.


Güzel bulamadığım için buraya yazdım

Yusufberki ye teşekkürler. Smile İşime yarayacak.
Mesaj17.08.2012, 10:45 (UTC)    
Mesaj konusu: slm

güzel paylaşım ama değişik modulleri yok mu acaba
Mesaj17.08.2012, 11:17 (UTC)    
Mesaj konusu:

http://www.webilgim.com/yan-menuler/

buyrun 11 tane mütiş açılır kapanır menü kodu
______________
Büyük işler başaran, Küçük adam..
DREAMWEAVER İLE BEDAVA-SİTEM İÇİN TASARIM YAPMA // RESİMLİ ANLATIM
Önceki mesajları göster:   


Powered by phpBB © 2001, 2005 phpBB Group
Türkçe Çeviri: phpBB Türkiye & Erdem Çorapçıoğlu