Webboard

wersja skryptu MyBB: 1.6.9
adres forum: Testowe!
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): Witam. Robię właśnie sobie panel użytkownika rozwijany (tym poradnikiem.). Wszystko ładnie działa, ale gdy rozwinę tenże panel to cała belka idzie w dół i się rozwala (Możecie sami zobaczyć.)

Dane konta testowego:
Login: Tester
Hasło: test123

Nie mogę się z tym uporać :<

Przy okazji logowanie do kitu. Czarne litery na czarnym tle.

Przy okazji tym też się zajmuję

Ps. Jak ustawić że gdy się rozwinie panel to strzałka zmieni się na "do góry"? BO cały czas mam tylko strzałkę skierowaną w dół.

https://webboard.pl/thread-18185.html
https://webboard.pl/thread-11531.html - zapewno chcesz Taki efekt

https://webboard.pl/wiki.php?rozwijany-p...wania.html

Nie chcę zwijanego panelu bocznego bo już go mam. Chcę rozwijany/zwijany panel użytkownika jak na I.P.B bądź tutaj. I nie chcę zwijanego panelu logowania..

Rozwija.

Kod:
<div id="main_menu">

<!-- Zawartość menu -->

</div>

Link/przycisk do rozwijania

Kod:
<div id="menu_toggle" class="show_hide" rel="#main_menu"><a href="#">LINK</a></div>

global.css

Kod:
#main_menu {

    position: relative;

    top: 15px;

    right: 20px;

    z-index: 100;

    display: none;

}

headerinclude

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

<script src="{$mybb->settings['bburl']}/jscripts/hide.js" type="text/javascript"></script>

<script type="text/javascript">

jQuery.noConflict();

jQuery(document).ready(function(){

   jQuery('.show_hide').showHide({             

        speed: 250,  // speed you want the toggle to happen    

        easing: '',  // the animation effect you want. Remove this line if you dont want an effect and if you haven't included jQuery UI

        changeText: 0, // if you dont want the button text to change, set this to 0

        showText: ' ',// the button text to show when a div is closed

        hideText: ' ' // the button text to show when a div is open

    }); 

});

</script>

Plik hide.js wrzuc do folderu jscripts na serwerze FTP.

Ja to już mam! Tylko gdy rozwijam rozwija mi się na całą szerokość i rozwala belkę!...

Screen jak to u mnie wygląda:

Screen jak chciałbym żeby to wyglądało:

Lub przynajmniej podobnie.

A to może kwestia tego, by w pliku .css określić:

Kod:
max-width: 200px;

Nie wiem jak wygląda to w praktyce, nie oglądałem poradnika, ale jeśli jest plik css, to wydaje się najrozsądniejsze. Jednak mnie to wygląda na jakiś błąd...

Zmien

Kod:
#main_menu {

     z-index: 100;

     display: none;

     background: #FFFFFF;

}

Kod:
#main_menu {

    position: relative;

    top: 15px;

    right: 20px;

    z-index: 100;

    display: none;

}

a moze zapodasz kod?

Dobra. Jeden problem za mną (nami?) Tylko teraz dalej poszerza belkę w dół. (Pomógł post carbona)

Ps. mybbtheme Ty znasz się coś na css w ogóle?

Hm, robiłem to według tego poradnika od Nidrax'a i nie przypominam sobie, żebym miał takie problemy.
Pierwsze co musisz to określić wysokość i szerokość tego wysuwanego pola (klasa sub_menu) oraz ustawić marginesy. Tutaj moja klasa sub_menu, porównaj i zobacz ewentualnie gdzie masz błąd:

Kod:
position: absolute;

background: #FCFCFC;

background: -moz-linear-gradient(top, rgba(252, 252, 252, 1) 0px, rgba(244, 244, 244, 1) 100%);

background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(252, 252, 252, 1)), color-stop(100%,rgba(244, 244, 244, 1)));

background: -webkit-linear-gradient(top, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

background: -o-linear-gradient(top, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

background: -ms-linear-gradient(top, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

background: linear-gradient(to bottom, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f4f4f4',GradientType=0 );

border-bottom: 1px solid #DDD;

padding: 5px 9px 5px 9px;

margin-top: 35px;

margin-left: 19px;

border-top: 3px solid #116AB8;

border-bottom: 3px solid #116AB8;

border-right: 1px solid #116AB8;

border-left: 1px solid #116AB8;

No to teraz to samo:

Kod:
max-height: 400px;

Matslom. Ok jest tylko teraz jest cały czas wysunięty. :/

Zapewne przez moją nieuwagę, zapomniałem dodać

Kod:
display: none;

do klasy. Uczyń to.

Matslom

Rozwiązałem ten problem. Tak wygląda moja klasa:

Kod:
#main_menu {

position: absolute;

 z-index: 100;

     display: none;

background: #FCFCFC;

background: -moz-linear-gradient(top, rgba(252, 252, 252, 1) 0px, rgba(244, 244, 244, 1) 100%);

background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(252, 252, 252, 1)), color-stop(100%,rgba(244, 244, 244, 1)));

background: -webkit-linear-gradient(top, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

background: -o-linear-gradient(top, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

background: -ms-linear-gradient(top, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

background: linear-gradient(to bottom, rgba(252, 252, 252, 1) 0px,rgba(244, 244, 244, 1) 100%);

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f4f4f4',GradientType=0 );

border-bottom: 1px solid #DDD;

padding: 5px 9px 5px 9px;

border-top: 3px solid #116AB8;

border-bottom: 3px solid #116AB8;

border-right: 1px solid #116AB8;

border-left: 1px solid #116AB8

}

Oczywiście cały czas testuje i naprawiam gdy skończę napiszę "poradnik" na prawidłowe rozwijanie

Ok zrobiłem ten panel tylko mam teraz parę ale. (Ps. wiem że 1 wątek = 1 problem ale to tyczy się tego samego)

1. Jak dodać że jak się kliknie w awatar to przenosi na profil?

2. Jak ustawić tekst od początku a nie od końca awatara?

3. Jak ustawić że jak się rozwinie panel to strzałka zmieni się z "arrowdown" na "arrowup"?

@2 rozwiązane. Jeszcze 1 i 3 ktoś pomoże?

GiboneKPL

SLAVOO

GiboneKPL

mybbtheme

GiboneKPL

mybbtheme

GiboneKPL

carbon9610

mybbtheme

GiboneKPL

Matslom

carbon9610

GiboneKPL

Matslom

GiboneKPL