Author Topic: Portalınız İçin Akordiyon Menü (html blok) (Read 8004 times)

tc bolubeyi · « **on:** August 10, 2010, 03:50:35 PM »

Demo: Spina Bifida Turkey

İşlem Basamakları:
1. Aşağıda verilen kodlarla html blok oluşturup, aktive edin.
2. Ekteki sıkıştırılmış klasörden çıkan dosyaları forum dizinine (setting.php nin olduğu yere) atınız.
3. Menü isimlerini ve linklerini kendinize göre düzenleyin.

Code: [Select]

<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="ddaccordion.js">

/***********************************************
* Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/

</script>


<script type="text/javascript">


ddaccordion.init({
    headerclass: "submenuheader", //Shared CSS class name of headers group
    contentclass: "submenu", //Shared CSS class name of contents group
    revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
    mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
    collapseprev: true, //Collapse previous content (so only one open at any time)? true/false 
    defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content
    onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
    animatedefault: false, //Should contents open by default be animated into view?
    persiststate: true, //persist state of opened contents within browser session?
    toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
    togglehtml: ["suffix", "<img src='plus.gif' class='statusicon' />", "<img src='minus.gif' class='statusicon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
    animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
    oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
        //do nothing
    },
    onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
        //do nothing
    }
})


</script>


<style type="text/css">

.glossymenu{
margin: 5px 0;
padding: 0;
width: 170px; /*width of menu*/
border: 1px solid #9A9A9A;
border-bottom-width: 0;
}

.glossymenu a.menuitem{
background: black url(glossyback.gif)  bottom left;
font:  14px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: black;
display: block;
position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
width: auto;
padding: 4px 0;
padding-left: 10px;
text-decoration: none;
}


.glossymenu a.menuitem:visited, .glossymenu .menuitem:active{
color: black;
}

.glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
position: absolute;
top: 5px;
right: 5px;
border: none;
}

.glossymenu a.menuitem:hover{
background-image: url(glossyback2.gif);
}

.glossymenu div.submenu{ /*DIV that contains each sub menu*/
background: white;
}

.glossymenu div.submenu ul{ /*UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
}

.glossymenu div.submenu ul li{
border-bottom: 1px solid blue;
}

.glossymenu div.submenu ul li a{
display: block;
font: normal 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: black;
text-decoration: none;
padding: 2px 0;
padding-left: 10px;
}

.glossymenu div.submenu ul li a:hover{
background: #DFDCCB;
colorz: white;
}

</style>

</head>

<body><center>

<div class="glossymenu">
<a class="menuitem submenuheader" href="" >Forum</a>
<div class="submenu">
    <ul>
    <li><a href="index.php?action=cevapsizkonu">Cevapsız konular</a></li>
    <li><a href="index.php?action=recenttopics">Son konular</a></li>
    <li><a href="index.php?action=recenttopics">Ajax son konular</a></li>
    <li><a href="index.php?action=recent">Son gönderilenleri oku</a></li>
    <li><a href="index.php?action=who">Çevrim içi üyeler</a></li>
    <li><a href="index.php?action=mlist">Üyelerimiz</a></li>
    <li><a href="index.php?action=stats">İstatistikler</a></li>    
    </ul>
</div>

<a class="menuitem submenuheader" href="" >Size Özel</a>
<div class="submenu">
    <ul>
    <li><a href="index.php?action=unread">Mesajlarınıza yazılanlar</a></li>
    <li><a href="index.php?action=unread">Okumadıklarız</a></li>    
    <li><a href="index.php?action=profile">Profiliniz</a></li>    
    <li><a href="index.php?action=bookmarks">Favori konularınız</a></li>    
    <li><a href="index.php?action=pm;f=inbox">Özel Mesajlarınız (Gelen)</a></li>
    <li><a href="index.php?action=pm;f=sent">Özel Mesajlarınız (Giden)</a></li>
    </ul>
</div>

<a class="menuitem submenuheader" href="" >Galeri</a>
<div class="submenu">
    <ul>
    <li><a href="index.php?action=mgallery;sa=album;id=2">Kız çocuklarımız</a></li>
    <li><a href="index.php?action=mgallery;sa=album;id=3">Erkek çocuklarımız</a></li>
    <li><a href="index.php?action=mgallery;sa=album;id=4">Büyükler</a></li>
    <li><a href="index.php?action=mgallery;sa=album;id=5">Etkinlikler</a></li>
    </ul>
</div>

<a class="menuitem submenuheader" href="" >SB Hakkında</a>
<div class="submenu">

    <ul>
    <li><a href="index.php?topic=87.0">Tecrübeler</a></li>
    <li><a href="index.php?board=33.0/">Genel konular</a></li>
    <li><a href="index.php?board=6.0/">Meningomyolosel</a></li>
    <li><a href="index.php?board=50.0/">Hidrosefali</a></li>
    <li><a href="index.php?board=8.0/">Ortopedik problemler</a></li>
    <li><a href="index.php?board=9.0/">Psikolojik konular</a></li>
    <li><a href="index.php?board=7.0/">Ürolojik konular</a></li>
    <li><a href="index.php?board=235.0">Dr. Arman ÖZDEMİR Bölümü</a></li>
    <li><a href="index.php?board=71.0">Doç. Dr. Y. Tarkan SOYGUR Bölümü</a></li>
    <li><a href="index.php?board=286.0    ">Fizyoterapistimize soralım</a></li>    
    </ul>
</div>


<a class="menuitem submenuheader" href="" >Download</a>
<div class="submenu">
    <ul>
    <li><a href="index.php?action=downloads;cat=1">Spina Bifida Dökümanları</a></li>
    <li><a href="index.php?action=downloads;cat=2">Programlar</a></li>
    <li><a href="index.php?action=downloads;cat=3">Çocuklar için</a></li>    
    </ul>
</div>

<a class="menuitem submenuheader" href="" >Mini Sınavlar</a>
<div class="submenu">
    <ul>
    <li><a href="index.php?page=page1357">Sınav 1</a></li>
    <li><a href="index.php?page=page72">Sınav 2</a></li>    
    <li><a href="index.php?page=page1974">Sınav 3</a></li>    
    <li><a href="index.php?page=page2100">Sınav 4</a></li>    
    <li><a href="index.php?page=page4640">Sınav 4</a></li>    
    </ul>
</div>

<a class="menuitem" href="index.php?action=blog">SBT Blog</a>
<a class="menuitem" href="index.php?board=246.0">Diğer SB Siteleri</a>
<a class="menuitem" href="chat/index.php">Sohbet Odası</a>
        
</div>
</center>
</body>
</html>

sevgidukkani.net · « **Reply #1 on:** September 27, 2010, 02:06:29 PM »

Bu menü tam benim aradağım cinsten emeğiniz için teşekkürler.
Şu anda bunu siteme uygulamakla meşgulum. Sıkıştırılmış klasörden çıkan dosyaları yüklemiycem çünkü sitemin rengi turuncu içerikte olacak. Bu klasördeki dosyların benzerini turuncu olarak basit bir şekilde nasıl yaparız?

tc bolubeyi · « **Reply #2 on:** September 27, 2010, 02:28:49 PM »

glossyback.gif ve glossyback2.gif isimli resimleri editleyerek istediğiniz rengi verebilirsiniz.

sevgidukkani.net · « **Reply #3 on:** September 27, 2010, 02:36:06 PM »

Şu an o editlemeyi yapıyorum. resimleri ftp'ye atmaya gerek kalmadanda çok şık duracak gibi. Tekrar teşekkür ederim bolubeyi.

turkpowers · « **Reply #4 on:** November 23, 2010, 05:17:28 PM »

explorerda menü bozuk çıkıyor

ayvazportal · « **Reply #5 on:** January 02, 2011, 01:19:31 PM »

SP yi hem forum, hem portal da kullanıyorum.Bu Menü portalda ve forum anasayfasında Çok İyi Hoş duruyor fakat Konu icine girildiğinde de açılmış vaziyete gelmiyor. Yardımcı Olur musunuz?

Site adresi: www.ayvazportal.net/forum

tc bolubeyi · « **Reply #6 on:** January 02, 2011, 04:04:32 PM »

Code: [Select]

<script type="text/javascript" src="ddaccordion.js">

Code: [Select]

background: black url(glossyback.gif) bottom left;
Bu satırlardaki resim ve dosya yollarının tam adresini yazmanız çözüm olabilir. Sitenizde seo ya da benzeri bir mod kurulu olduğu için çalışmıyor.

ayvazportal · « **Reply #7 on:** January 03, 2011, 04:20:48 PM »

Allah razı olsun çok teşekkürler. Söylediğiniz şekilde yaptım şuan heryerde normal çalışıyor..

Simple Portal Archived Forum

User Info

Who's Online

Sohbet Kutusu

Team Blog

Recent Posts

Author Topic: Portalınız İçin Akordiyon Menü (html blok) (Read 8004 times)

tc bolubeyi

Portalınız İçin Akordiyon Menü (html blok)

sevgidukkani.net

Re: Portalınız İçin Akordiyon Menü (html blok)

tc bolubeyi

Re: Portalınız İçin Akordiyon Menü (html blok)

sevgidukkani.net

Re: Portalınız İçin Akordiyon Menü (html blok)

turkpowers

Re: Portalınız İçin Akordiyon Menü (html blok)

ayvazportal

Re: Portalınız İçin Akordiyon Menü (html blok)

tc bolubeyi

Re: Portalınız İçin Akordiyon Menü (html blok)

ayvazportal

Re: Portalınız İçin Akordiyon Menü (html blok)