Konuyu Oyla:
  • Toplam: 0 Oy - Ortalama: 0
  • 1
  • 2
  • 3
  • 4
  • 5
SideMenu (Forumun Solunda Açılır Kapanır 4lü Menü)
#1
(10-12-2012, 09:23 AM)kaRanLık-61 Nickli Kullanıcıdan Alıntı:  Admin Kp --> Şablonlar&Stil --> Şablonlar --> Header Şablonları --> Header

En Altına Ekleyin.


Kod:
<!-- start: sidemenu_css -->
<style type="text/css">
.sidemenu,
.sidemenu * {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    line-height: 18px;
    color: #555;
    vertical-align: baseline;
}
.barsearch_box {
font-style:italic;
}
.sidemenu,
.sidemenu > li > ul {
    list-style-type: none;
}
.sidemenu {
    position: fixed;
   top: 400px;
left: 0;
    background-color: #f7f7f7;
    background-color: rgba(240, 240, 240, 0.75);
    border: 1px solid #b7b7b7;

    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    box-shadow: 0 0 5px #ccc;
    -moz-box-shadow: 0 0 5px #ccc;
    -webkit-box-shadow: 0 0 5px #ccc;
    width: 25px;
    overflow: visible;
    z-index: 90000;
}
.sidemenu-right {
    right: auto;
    left: 0;
    border-left: none;
    border-right: 1px solid #b7b7b7;
}
.sidemenu > li {
    position: relative;
}
.sidemenu > li > a {
    display: block;
    width: 16px;
    height: 16px;
    padding: 4px;
    background-color: #f0f0f0;
    background-color: rgba(240, 240, 240, 0.75);
    background-position: 4px 4px;
    background-repeat: no-repeat;
}
.sidemenu > li {
    border-bottom: 1px solid #f7f7f7;
    border-left: 1px solid #f7f7f7;    
    border-top: 1px solid #ccc;
}
.sidemenu > li:first-child {
    border-top: 1px solid #f7f7f7;
}
.sidemenu > li:last-child {
    border-bottom: 1px solid #f7f7f7;
}
.sidemenu > li > a:hover {
    background-color: #eaeaea;
}
.sidemenu > li > ul {
    display: none;
    position: absolute;
    left: 25px;
    top: -2px;
    width: 180px;
    overflow: hidden;
    background-color: #f7f7f7;
    background-color: rgba(240, 240, 240, 0.75);
    border: 1px solid #b7b7b7;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    box-shadow: 0 0 5px #ccc;
    -moz-box-shadow: 0 0 5px #ccc;
    -webkit-box-shadow: 0 0 5px #ccc;
    z-index: 950;
}
.sidemenu-right > li > ul {
    left: auto;
    right: 25px;
}
.sidemenu > li > ul:nth-child(3) {
    left: 206px;
}
.sidemenu > li > ul:nth-child(4) {
    left: 387px;
}
.sidemenu > li > ul:nth-child(5) {
    left: 568px;
}
.sidemenu > li > ul:nth-child(6) {
    left: 749px;
}
.sidemenu > li > ul:nth-child(7) {
    left: 930px;
}
.sidemenu-right > li > ul:nth-child(3) {
    left: auto;
    right: 206px;
}
.sidemenu-right > li > ul:nth-child(4) {
    left: auto;
    right: 387px;
}
.sidemenu-right > li > ul:nth-child(5) {
    left: auto;
    right: 568px;
}
.sidemenu-right > li > ul:nth-child(6) {
    left: auto;
    right: 749px;
}
.sidemenu-right > li > ul:nth-child(7) {
    left: auto;
    right: 930px;
}
.sidemenu > li:hover > ul {
    display: block;
    float: left;
}
.sidemenu.sidemenu-js > li:hover > ul {
    display: none;
}
.sidemenu > li > ul > li {
    border-bottom: 1px solid #f7f7f7;
    border-left: 1px solid #f7f7f7;    
    border-top: 1px solid #ccc;
    min-width: 180px;
    text-shadow: 1px 1px 1px #fff;
}
.sidemenu > li > ul > li:first-child {
    border-top: 1px solid #f7f7f7;
}
.sidemenu > li > ul > li:last-child {
    border-bottom: 1px solid #f7f7f7;
}
.sidemenu > li > ul > li {
    border: none !ie;
}
.sidemenu > li > ul > li > a {
    display: block;
    padding: 8px 10px 8px 32px;
    background-color: #f0f0f0;
    background-color: rgba(240, 240, 240, 0.75);
    background-position: 10px;
    background-repeat: no-repeat;
    color: #555;
    min-height: 20px;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent !ie;
}
.sidemenu > li > ul > li > a:hover {
    background-color: #eaeaea;
}
.sidemenu > li > ul > li.sidemenu-title > a {
    padding-right: 10px;
    background-color: #e6e6e6;
    cursor: default;
    font-weight: bold;
    background-color: transparent !ie;
}
.sidemenu > li > ul > li.sidemenu-title > a:hover {
    background-color: #e6e6e6;
    background-color: transparent !ie;
}
.sidemenu > li > ul > li > table {
    border-collapse:collapse;
    border-spacing: 0;
}
.sidemenu > li > ul > li > form {
    padding: 8px 10px;
}
.sidemenu > li > ul > li input,
.sidemenu > li > ul > li select,
.sidemenu > li > ul > li textarea,
.sidemenu > li > ul > li button  {
    margin: 4px 0;
    padding: 4px;
}
.sidemenu > li > ul > li input[type="text"],
.sidemenu > li > ul > li input[type="password"],
.sidemenu > li > ul > li textarea {
    border: 1px solid #ccc;
    box-shadow: inset 0 0 3px #ccc;
    -moz-box-shadow: inset 0 0 3px #ccc;
    -webkit-box-shadow: inset 0 0 3px #ccc;
    min-width: 150px;
    width: auto;
}
.sidemenu > li > ul > li input[type="submit"] {
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    box-shadow: 0 0 3px #ccc;
    -moz-box-shadow: 0 0 3px #ccc;
    -webkit-box-shadow: 0 0 3px #ccc;
}
.sidemenu-arrow {
    position: absolute;
    right: 25px;
    top: 8px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #b7b7b7;
    border-left: none;
}
.sidemenu-right .sidemenu-arrow {
    right: auto;
    left: 25px;
    border-left: 5px solid #b7b7b7;
    border-right: none;
}
.icon-usercp {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/memberlist.png);
}
.icon-search {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/search.png);
}
.icon-calendar {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/calendar.png);
}
.icon-email {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/email.png);
}
.opt {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/opt.png);
}

.analiz {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/analiz.png);
}
.analiz2 {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/analiz2.png);
}

.icon-twitter {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/twitter.png);
}
.icon-facebook {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/tools.png);
}
.icon-flickr {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/flickr.png);
}
.icon-google {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/google.png);
}
.icon-yahoo {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/yahoo.png);
}
.icon-youtube {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/youtube.png);
}
.icon-rss {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/rss.png);
}
.icon-wikepedia {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/wikepedia.png);
}
.icon-ebay {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/ebay.png);
}
.icon-home {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/home.png);
}
.icon-memberlist {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/memberlist.png);
}
.icon-help {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/help.png);
}
.icon-admin {
    background-image: url(http://st.10tl.net/tema/karanlik/sidemenu_icons/admin.png);
}
</style>
<script type="text/javascript">
        jQuery.noConflict();
        jQuery(document).ready(function(){
            jQuery('#dobar').sidemenu({
            showOn        : 'hover'
            });
        });
</script>
<ul id="dobar" class="sidemenu">
        
        <li style="text-align:right;">
            
<a href="#" class="icon-usercp" title="Kullanıcı KP"></a>
            <ul>
                <li class="sidemenu-title">
                    <a href="#">Kullanıcı KP</a>
                </li>
                <li>

                    <a href="index.php" class="icon-home">Anasayfa</a>
                </li>
                <li>
                    <a href="memberlist.php" class="icon-memberlist">Üye Listesi</a>
                </li>
                <li>
                    <a href="calendar.php?calendar=1" class="icon-calendar">Takvim</a>

                </li>
                <li>
                    <a href="misc.php?action=help" class="icon-help">Yardım</a>
                </li>

            </ul>
        </li>
        
        <li style="text-align:right;">
            <a href="#" class="opt" title="Menu Adı"></a>

            <ul>
                <li class="sidemenu-title">
                    <a href="#">Sosyal Ağ</a>
                </li>
                
                                <li><a href="http://fb.com/10TL.NET" target="blank" class="icon-facebook">Facebook</a></li>
                <li><a href="http://twitter.com/10tlnet" target="blank" class="icon-twitter">Twitter</a></li>
<li><a href="http://youtube.com" target="blank" class="icon-youtube">YoutuBe</a></li>
<li><a href="/syndication.php" target="blank" class="icon-rss">Rss</a></li>

<li><a href="http://search.yahoo.com" target="blank" class="icon-yahoo">Yahoo</a></li>
            </ul>
        </li>
          
        <li>
            <a href="#" class="icon-search" title="Arama"></a>

            <ul>
                <li>
                    <form method="post" action="search.php">
                        <input type="hidden" name="action" value="do_search" />
                        <input type="hidden" name="postthread" value="1" />
                        <input type="hidden" name="forums" value="all" />
                        <input type="hidden" name="showresults" value="threads" />
                        <input type="text" class="barsearch_box" name="keywords" placeholder="Arama..."/>
                        <input type="submit" value="Ara" />

                    </form>
                </li>
            </ul>
        </li>
        


           <li style="text-align:right;">
            <a href="#" class="analiz" title="Menu Adı"></a>

            <ul>
                <li class="sidemenu-title">
                    <a href="#">Menu Adı</a>
                </li>


<li><a href="Link Ekle" target="blank" class="analiz2">Link Adı</a></li>
<li><a href="Link Ekle" target="blank" class="analiz2">Link Adı</a></li>
<li><a href="Link Ekle" target="blank" class="analiz2">Link Adı</a></li>

            </ul>
        </li>
</li></li>


        <li style="text-align:right;"></li></ul>


Bu Kodu Ekleyin ve Kaydetin.

Not:

Kodda "Menu Adı,Link Ekle,Link Adı" Bunları Değiştirmeyi Unutmayın.Resimleri Başka Bir Siteden Geliyor Resimlerin Alıp Başka Bir Sağlam Yere Yüklerseniz Sorun Olmayacaktır.

Caps:

caps2.gif

caps1.gif
Okyanusta batan gemidir yalnızlık,
Çok derinlerdedir gücün yetmez onu oradan çıkarmaya.
Kaybolup gider daha sonra.
Kendi kendine konuşmaktır yalnızlık...
Belkide en iyi tarafıdır bu
Kendini sorgularsın, bir kez olsun çekersin köşeye nefsini hayatı anlamaya çalışırsın.

Cevapla


Hızlı Menü:


Şu anda bu konuyu okuyanlar: 1 Ziyaretçi

Online Shopping App
Online Shopping - E-Commerce Platform
Online Shopping - E-Commerce Platform
Feinunze Schmuck Jewelery Online Shopping