Skocz do zawartości
  • 0
LegioN

Tworzenie skinu problem z menu "Więcej"

Pytanie

Witam, dziś piszę w imieniu kolegi "Grafera" który stworzył skin, lecz mamy z nim pewien mały problem, otóż problem dotyczy zakładki menu "Więcej". Zakładka "Więcej" ma się wyświetlać po zdefiniowanej szerokości w divie. Gdy dodany jest  float: right wówczas zakładka "Więcej" pojawia się już jako druga, natomiast bez float:right jest niby dobrze, lecz zbyt blisko logo.. Problem również zobrazuje w screenach. Liczymy na szybką pomoc. Pozdrawiamy MatFi i Grafer.

 

dlr.png x9s7.png

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

16 odpowiedzi na to pytanie

Polecane posty

  • 0

na jaki element nadawany jest float?

 

ogólnie to się robi tak, że ustala się szerokość div'a i na nim się daje float'a i wtedy jest wszystko git

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

float jest nadawany nad divem, który definiuje szerokość menu. Tak czy inaczej jeśli dam bezpośrednio float na primary_nav, czyli diva, który definiuje szerokość (za pomocą min-width) wtedy szerokość menu przyjmuję wartość min-width i menu same w sobie jest przyległe do prawej, ale zawartość menu jest przyległa do lewej strony menu. (Co przy szerokości 60% ogólnej szerokości, i 3 zakładkach daję, że zakładki są mniej więcej po środku strony)

<div style='float:right;'>
					<div id='primary_nav' class='clearfix'>
						<ul class='ipsList_inline' id='community_app_menu'>
							
							<if test="showhomeurl:|:$this->settings['home_url'] AND $this->settings['home_name']">
								<li id='nav_home' class='left'><a href='{$this->settings['home_url']}' title='{$this->lang->words['homepage_title']}' rel="home">{$this->settings['home_name']}</a></li>
							</if>
							<if test="hasCustomPrimaryNavigation:|:!empty($header_items['primary_navigation_menu'])">
								{$header_items['primary_navigation_menu']}
							<else />
								<if test="applicationsloop:|:is_array($header_items['applications']) AND count($header_items['applications'])">
									<foreach loop="applications:$header_items['applications'] as $data">
										<if test="showingapp:|:$data['app_show']">
											{parse variable="appActive" default="" oncondition="$data['app_active']" value="active"}
											<li id='nav_app_{$data['app_dir']}' class="left {parse variable="appActive"}"><a href='{parse url="{$data['app_link']}" seotitle="{$data['app_seotitle']}" template="{$data['app_template']}" base="{$data['app_base']}"}' title='{parse expression="sprintf( $this->lang->words['go_to_prefix'], IPSLib::getAppTitle($data['app_dir']) )"}'>{IPSLib::getAppTitle($data['app_dir'])}</a></li>
										</if>
									</foreach>
								</if>
							</if>
									<li id='nav_other_apps' style='display: none'>
										<a href='#' class='ipbmenu' id='more_apps'>{$this->lang->words['more_apps']} <img src='{$this->settings['img_url']}/useropts_arrow.png' /></a>
									</li>
						</ul>
					</div>
				</div>
Edytowano przez Grafer

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Ja to zrobiłem na jednym skinie w ten sposób:

<div id='primary_nav' class='clearfix'>
    <div class=''>
        <ul class='ipsList_inline' id='community_app_menu'>
            
            <if test="showhomeurl:|:$this->settings['home_url'] AND $this->settings['home_name']">
                <li id='nav_home' class='left'><a href='{$this->settings['home_url']}' title='{$this->lang->words['homepage_title']}' rel="home">{$this->settings['home_name']}</a></li>
            </if>
            <if test="hasCustomPrimaryNavigation:|:!empty($header_items['primary_navigation_menu'])">
                {$header_items['primary_navigation_menu']}
            <else />
                <if test="applicationsloop:|:is_array($header_items['applications']) AND count($header_items['applications'])">
                    <foreach loop="applications:$header_items['applications'] as $data">
                        <if test="showingapp:|:$data['app_show']">
                            {parse variable="appActive" default="" oncondition="$data['app_active']" value="active"}
                            <li id='nav_app_{$data['app_dir']}' class="left {parse variable="appActive"}"><a href='{parse url="{$data['app_link']}" seotitle="{$data['app_seotitle']}" template="{$data['app_template']}" base="{$data['app_base']}"}' title='{parse expression="sprintf( $this->lang->words['go_to_prefix'], IPSLib::getAppTitle($data['app_dir']) )"}'>{IPSLib::getAppTitle($data['app_dir'])}</a></li>
                        </if>
                    </foreach>
                </if>
            </if>
            <li id='nav_other_apps' style='display: none'>
                <a href='#' class='ipbmenu' id='more_apps'>{$this->lang->words['more_apps']} <img src='{$this->settings['img_url']}/useropts_arrow.png' /></a>
            </li>
        </ul>
    </div>
</div>	


i do tego css:

#primary_nav {
    float: right;
    font-size: 12px;
    font-weight: bold;
    padding: 3px 0 0;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.7);
margin-top: 36px;

}

i umieszczone to jest koło logo więc wygląda wszystko ładnie :)

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

U mnie to nic nie zmienia. To znaczy, jeśli dam tego primary jak jest bez zdefiniowanej szerokości to przylega do prawej, ale skraca menu już w drugiej zakładce, dając "Więcej". a gdy zdefiniuje szerokość, przylega do prawej, ale menu przyjmuje tę szerokość,a zakładki idą do lewej strony.

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

a jaki efekt chcesz osiągnąć, bo mogę pomagać itp ale w sumie nie wiem dokładnie co chcesz osiągnąć, ewentualnie przedstaw to na screenie i fajnie by było jakbyś miał to online, to bym sobie zerknął i na "żywca" zrobił zmiany i powiedział co i jak poprawić

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

http://grafer.hmhost.pl/ <-- Live demo ;). Chcemy aby zakładki przylegały do prawej strony, a zakładka "więcej" pojawiała się po zdefiniowanej szerokości w divie. Tylko pytanie, jak ?

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Na oko powinno wystarczyć nadać szerokość na element:

<div style="height: 156px;">

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Ogólnie jest tak, że menu "Więcej" zależne jest od szerokości elementu o ID community_app_menu, czyli tego ul'a

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Niestety, gdy na sztywno daję szerokość na ula też przechodzi do następnej linijki, zamiast się zwinąć.

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

i prawidłowo :) zgubiłeś jeden ważny element. Ten div co pisałem z height... musi mieć id="primary_nav" i będzie wszystko śmigać

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Spanner dobrze mowi, nawet wiem gdzie to bylo wyprobowane i dziala prawidlowo

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Niby działa, ale jak jest sztywno zdefiniowana szerokość menu, lub gdy w ogóle nie ma szerokości (wtedy na sztywno zwija się na 8 zakładce). Mi zależy natomiast, aby szerokość była definiowana procentowo, a niestety przy szerokości przykładowo 60%, niby się zwija, ale przechodzi też do następnej lini.

 

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

to daj mu min-width, żeby ustalić minimalną szerokość, przy % będzie problem, ale pewnie też da się, tylko więcej zabawy z tym będzie...

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

Niestety na ula nie mogę dać szerokości, ponieważ zakładki przylegają do lewej strony menu. Dlatego zdefiniowałem szerokość na divie wyżej (primary_nav). A ulowi dałem tylko min-width, żeby się nie zwijał na drugiej

.

Mniej więcej działa, ale jest problem, ponieważ mimo, że mam min-width na 3 zakładki, a w menu też ,mam tylko 3 zakładki, to ostatnia się zwija w "więcej" i po rozwinięciu pokazuje tylko jedną z nich. Trochę to bez sensu.

 

demo : http://grafer.hmhost.pl/

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
  • 0

wg mnie min-width na ul to głupi pomysł, bo menu jest w tym momencie delikatnie wcięte z prawej strony i nieładnie wygląda.szerokość wystarczy ustawić na element wyżej tylko trzeba sprawdzić jaką zapewne 3 pozycje i ciut, żeby nie zwijało tej ostatniej, ewentualnie na 4

Udostępnij ten post


Link to postu
Udostępnij na innych stronach
Gość
Temat jest zablokowany i nie można w nim pisać.

  • Podobna zawartość

    • Przez Versusx3


      Zobacz plik Orangestyle-MakaveliHS
      Bardzo ładny, przejrzysty skin o pomarańczowych kolorach. Nadaje się pod każdą tematykę forum.
      [/img]
      Dodający Versusx3 Dodano 15.01.2017 Kategoria Skiny Wersja forum  
    • Przez Versusx3
      Bardzo ładny, przejrzysty skin o pomarańczowych kolorach. Nadaje się pod każdą tematykę forum.
      [/img]
    • Przez Versusx3


      Zobacz plik 4umGames.pl - GreenSkin
      Ładny i przejrzysty skin o zielonym kolorze. Nadaje się pod fora wielotematyczne.
      Dodający Versusx3 Dodano 03.05.2015 Kategoria Skiny Wersja forum  
    • Przez Versusx3
      Ładny i przejrzysty skin o zielonym kolorze. Nadaje się pod fora wielotematyczne.
    • Przez Pro
      Witam, 
       
      Gdzie mogę kupić taki skin 

  • Kto przegląda   0 użytkowników

    Brak zalogowanych użytkowników przeglądających tę stronę.

×

Ważne informacje

Kontynuując przeglądanie strony, wyrażasz zgodę na używanie przez nas plików cookies.