Znajdź zawartość
Wyświetlanie wyników dla tagów 'pasek' .
-
Witam, jak zrobić nowy pasek przewijania w przeglądarce? Czytałem coś że trzeba w CSS ale czy ma ktoś jakiś dobry poradnik by osiągnąć taki efekt?
- 3 odpowiedzi
-
- pasek
- przewijanie
-
(i 3 więcej)
Oznaczone tagami:
-
Witam, mam pewien problem mianowicie, chciałbym zmienić tekst "Invision Power Board" w drzewku nawigacji po działach i tematach na swój własny tekst. Jednak nie wiem gdzie to zrobić, w global template nie ma takiego wyrażenia, mógłby mi ktoś dokładnie napisać w jakim pliku to się znajduje. Pozdrawiam
- 3 odpowiedzi
-
- secondary
- navigation
-
(i 3 więcej)
Oznaczone tagami:
-
Co zrobić, aby pasek z ikonkami (góra) był nieruchomy a dodatkowo zawierał mini foto przy nazwie? 1. W panelu administracyjnym dodajemy w naszym skinie w global_template wpis o treści <!-- mobileo - mini foto--><img src='{$this->memberData['pp_small_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" class='ipsUserPhoto ipsUserPhoto_mini_header' /> <!-- konic mini foto--> Dodajemy go w tym miejscu <li><a id='user_link' href="{parse url="showuser={$this->memberData['member_id']}" seotitle="{$this->memberData['members_seo_name']}" template="showuser" base="public"}" title='{$this->lang->words['your_profile']}'>[b]<!-- Mobileo - dodaje mini foto--><img src='{$this->memberData['pp_small_photo']}' alt="{$this->memberData['members_display_name']}{$this->lang->words['users_photo']}" class='ipsUserPhoto ipsUserPhoto_mini_header' /> <!-- konic mini foto-->[/b]{$this->memberData['members_display_name']} <span id='user_link_dd'></span></a></li> Ten zabieg spowoduje, że obok nazwy pojawi się foto i będzie ono jednocześnie linkiem do rozwijanej karty profilu. Ale to zdjęcie jest duże. Jak widać w powyższym wpisie zdjęcie dostało klasę ipsUserPhoto_mini_header. Więc w głównym pliku CSS czyli ipb_style dodajemy wpis .ipsUserPhoto_mini_header { width: 25px; height: 25px; } najlepiej dodać do już istniejących wpisów klas zdjęć co wygląda wtedy tak .ipsUserPhoto_variable { max-width: 155px; } .ipsUserPhoto_large { max-width: 90px; max-height: 90px; } .ipsUserPhoto_medium { width: 50px; height: 50px; } .ipsUserPhoto_mini { width: 30px; height: 30px; } .ipsUserPhoto_mini_header { width: 25px; height: 25px; } .ipsUserPhoto_tiny { width: 20px; height: 20px; } .ipsUserPhoto_icon { width: 16px; height: 16px; } teraz zdjęcie jest małe i ładne. Nieruchomy pasek. Musimy ustalić mu atrybut position: fixed; Dokładnie w tym samym pliku stylu, co powyżej. Jest on zawsze wczytywany, więc każda aplikacja odziedziczy nowe ustawienia. Szukamy w pliku ipb_styles #header_bar W oryginale wygląda on tak: #header_bar { background: #323232 url(http://www.symbianforum.pl/public/style_images/master/user_navigation.png ) repeat-x bottom; padding: 0; text-align: right; } Dodajemy mu 3 ostatnie linijki i wygląda tak: #header_bar { background: #323232 url(http://www.symbianforum.pl/public/style_images/master/user_navigation.png ) repeat-x bottom; padding: 0; text-align: right; position:fixed; width: 100%; z-index: 9999; } position-fixed czyli zawsze na górze, szerokość 100% i z-index 9999 (teoretycznie 999 jest najwyższą wartością ale ...), a więc zawsze na górze (klasyfikacja warstw). Teraz jeszcze jeden wpis do #branding czyli niższego paska z logo. Musimy go obniżyć o wartość wysokości nieruchomego paska. W tym samym pliku stylów szukamy #branding i z #branding { background: #0f3854 url(http://www.symbianforum.pl/public/style_images/master/branding_bg.png) repeat-x bottom left; border-bottom: 1px solid #1b3759; min-height: 64px; } robimy #branding { background: #0f3854 url(http://www.symbianforum.pl/public/style_images/master/branding_bg.png) repeat-x bottom left; border-bottom: 1px solid #1b3759; min-height: 64px; padding-top: 36px; } Gotowe. Jeżeli nie widać zmian - CRTL+F5 lub przebudowa skina. Tekst z bloga: www.symbianforum.pl/blog/1/entry-19-jak-zrobic-nieruchomy-pasek-ala-facebook-w-ipb/ Powyższy tekst jest chroniony prawem autorskim. Można rozpowszechniać pod warunkiem podania źródła. 2012 © MotyF - Mobileo