PDA

Zobacz pełną wersję : Przesuniecie pozycji menu.



bartspam
13-05-2009, 14:00
Mam menu w <ul><li> i chcialbym przesuanc jedna pozycje tego menu troche w lewa strone. Da sie to zrobic za pomoca css ? Chodzi o to ze jedna z tych pozycji(linkow) jest obrazem i chcialbym ja troche presunac np. w lewa strone (i do gory jezeli mozna), jest to mozliwe. Bo komendy jak wpisuje w css nie dzialaja.

zwiastun
13-05-2009, 14:56
w standardowym menu w Joomla 1.5 każda pozycja ma klasę itemXXX - możesz ją wykorzystać do sformatoania dowolnej pozycji

bartspam
13-05-2009, 18:30
Hmm opisze wszystko dokladnie bo u mnie to nie dziala. Ale wiem o co Ci chodzi zwiastun bo wyczytalem na innym forum o tym samym.

Mam menu_left i w nim dodany np. home. Ten home ma w opcjach zamienione ze jest obrazkiem i jak na niego klikniemy to kieruje nas gdzies tam. Menu posiada sufix:-menuleft

czyli w pliku css mam.




div.moduletable-menuleft
{
cos tam
}

div.moduletable-menuleft h3
{
cos tam
}

div.moduletable-menuleft .item1
{
left: 20px;
}



tylko, ze to left: 20pixow; wogole nie dziala...

I jeszcze jedno podlinki z menu np.

AKTUALNOSCI
|
--- DODAJ WIADOMOSC

DODAJ WIADMOSC nie wyswietla sie gdy klikne na AKTUALNOSCI. Mimo ze w menu jest tak ustawione. Czasami sie pojawia czasami nie... Nie mam pojecia co jest grane.

MOze dodanie sufixu do linku (obrazku home) cos da?

zwiastun
13-05-2009, 18:31
Skoro wybrałeś rozwiązanie niezalecane to masz co masz.

bartspam
13-05-2009, 18:35
A w jakims poprzednim poscie widzialem jak chyba wlasnie poleczasz to rozwiazanie i daltego je zastosowalem (moze chodzilo o cos dokladnie na odwrot). Mozesz cos wieceje powiedziec na temat tego dobrego rozwiazania ? Jak to ustawic jakis link do opisu jak to wyglada, czy odnosnik gdzie pisza o tym dobrym ? Moze byc angielski.

bartspam
13-05-2009, 18:41
OK chyba znalazlem chodzi o .module_menu ? Zaraz przetestuje to bede wiedzial ^^

EDIT:
Nie dziala...

.module_menu-menuleft
{
cos tam
}

.module_menu-menuleft h3
{
cos tam
}

.module_menu-menuleft .item1
{
left: 20px;
}

Nie przynosi rezultatu. W menu style mam wybrane LIST.

menu jest nazwane menu_left, wiec w gre wchodziloby jeszcze:

.module_menu_left-menuleft
{
cos tam
}

.module_menu_left-menuleft h3
{
cos tam
}

.module_menu_left-menuleft .item1
{
left: 20px;
}

nie dziala...
Edit: z div. tez nie... nie mam pojecia jak to zrobic. Zerkne na zagraniczne jeszcze moze cos odpisali.

bartspam
13-05-2009, 23:09
Dla wszystkich majacy podobny problem znalazlem to:

http://wiki.joomla.pl/Stosowanie_przyrostków_klas_w_Joomla!_1.5

Jak pogrzebie dam znac co i jak.

EDIT:

Nie mam pojecia jak edytowac menu za pomoca css. Zadne z powyzszych wskazowek nie dziala u mnie. Jak jakis guru wie co robie zle niech da znac bo inaczej chyba nie rusze.

bartspam
16-05-2009, 03:52
Zwiastun poradz cos, wskaz jakiegos linka albo napisz kilka inspirujacych slow bo siedze nad tym 2 dzien. Przeinstalowac joomle ? Moze cos jest nie tak ?

zwiastun
16-05-2009, 03:54
Styl menu - lista
A reszta to już CSS

bartspam
16-05-2009, 14:24
Tak jak pisalem w 6 poscie mam w menu style wybrane LIST (czyli z ul, li). Bo gdzies juz widzialem twoj post, nie moge teraz znalezc, ze wlasnie to polecasz. Parametry mam takie.

---

Module Parameters

Menu Name menuleft
Menu Style LIST

Start Level 0
End Level 0
Always show sub-menu Items No

Target Position PUSTE

-----

Advanced Parameters

Show Whitespace NO

Caching USE GLOBAL

Menu Tag ID PUSTE
Menu Class Suffix PUSTE
Module Class Suffix -menuleft
Maximum Menu Depth 10

----

Other Parameters

Show Menu Images Yes
Menu Image Alignment Left
Menu Image Link Yes
Expand Menu No
Activate Parent No
Full Active Highlighting No

Indent Image TEMOPLATE
reszta default.
Indent Image 1
Indent Image 2
Indent Image 3
Indent Image 4
Indent Image 5
Indent Image 6

W menu mam 5 pozycji. HOME - ktory jest obrazkiem i chce go przesunac troche w lewo. Aktualnosci,ktore sa "rodzicem" dla dwoch podlinkow DODAJ WIADOMOSC oraz ARCHIWUM. Potem sa LINKI i GALERIA.

Czyli

HOME (item1)
|
AKTUALNOSCI (item2)
|
--------DODAJ NEWSA (item3)
|
--------ARCHIWUM (item4)
|
GALERIA (item5)
|
LINKI (item6)

Menu w menu menager nazywa sie menu_left.
Co mam wpisac z css aby obrazek HOME przesunac w lewa strone ? (komendy text-indent: 30px; line-height: 27px; dzialaja ale left: 20px; juz nie). Co zrobic aby po kliknieciu w AKTUALNOSCI pojawialy sie linki DODAJ WIADOMOSC oraz ARCHIWUM ? Teraz pojawiaja sie bardzo zadko, jak laduje strone od poczatku to czasami widac je juz rozwiniete. Jak klikam w aktualnosci to linki nie pojawiaja sie... Nie potrafie sobie z tym poradzic. Czy ktos moglby podac kawalek kodu css, ktory pomoze w rozwiazaniu tych problemow ? Dzieki za wszelkie uwagi i dotychczasowe odpowiedzi.

zwiastun
16-05-2009, 15:47
ten standardowy obrazek umieszczany przez Joomla! za pomocą parametrów może mieć bodaj maks. 11x11 px, a przesuwanie wymaga grzebania w kodzie Joomla!.
Ja piszę o możliwości stylowania konkretnej pozycji menu, jaką daje klasa itemXXX.
Ogólnie:
- usuwasz z listy wyświetlającej menu punktowanie (list-style:none)
- stylizujesz ogólnie wszystkie pozycje danego menu
- stylizujesz konkretną pozycję
Obrazek umieszczasz za pomocą backround

bartspam
16-05-2009, 18:07
Tak wlasnie mam zrobione: zamiast list-style:none; mam list-style-image: url("../images/trans_dot.png"); czyli przezroczysta kropeczke 1x1px. Obrazki background tez sa poumieszczane.

menu jest wystylizowane - pozycja,szerokosc itp.


div.moduletable-menuleft h3
{
display: none;
}

div.moduletable-menuleft
{
position: relative;
top: -750px;
width: 250px;
font-size: 15px;
font-family: verdana;
font-style: normal;
font-weight: normal;
}

Jezeli chodzi o stylizowanie pozycji:

div.moduletable-menuleft .item1 /* button MENU - home */
{
height: 120px;
!!! TUTAJ NIE DZIALA left: 50xp; - o to mi chodzi miedzy innymi !!!
}

div.moduletable-menuleft .item2 /* AKTUALNOSCI */
{
background: url("../images/title_main.png") no-repeat;
text-indent: 30px;
line-height: 27px;
}

div.moduletable-menuleft .item3 /* AKTUALNOSCI - DODAJ NEWSA, podlink */
{
background: url("../images/title_sub.png") no-repeat;
}

div.moduletable-menuleft .item4 /* AKTUALNOSCI - ARCHIWUM, podlink */
{
background: url("../images/title_sub.png") no-repeat;
}

div.moduletable-menuleft .item5 /* GALERIA */
{
background: url("../images/title_sub.png") no-repeat;
text-indent: 30px;
line-height: 27px;
}

div.moduletable-menuleft .item6 /* LINKI */
{
background: url("../images/title_sub.png") no-repeat;
text-indent: 30px;
line-height: 27px;
}

Powiedzcie prosze co robie zle. Wydaje im sie ze to blad w tym kodzie (konkretnie to chyba cos z klasami). Bo jak klikne na aktualnosci to nie pojawiaja sie podlinki DODAJ NEWSA i ARCHIWUM.

To DODAJ NEWSA nie pojawia sie takze po zalogowaniu na strone (to gdyby ta opcja byla dostepna tylko dla zalogowanych, ale po zalogowaniu takze sie nie wyswietla ten link w menu).

Jak tylko strona bedzie online dam link do strony. Chodzimio taki efekt jak http://www.starcraft2.net.pl/ gdy klikniecie w menu na PUBLICYSTYKA.

malkowitch
16-05-2009, 22:20
Po pierwsze. na przyszłość Ci radzę, nie używaj tego:

position: relative;
top: -750px;po drugie:

!!! TUTAJ NIE DZIALA left: 50xp; - o to mi chodzi miedzy innymi !!!Do czego ma się tyczyć te left. left masz tylko przy ustawionym position; korzystaj jeśli już to z padding lub margin.

mogę wiedzieć poco zmieniałeś styl listy na przezroczysty obraz?

bartspam
16-05-2009, 22:50
Rozumiem, dzieki nie wiedzialem, że left można stosować tylko w połączeniu z position.

Strona to http://www.diii.pl/ - totalny bałagan ze względu na css.

Niestety nadal nie moge tego ustawic. http://img40.imageshack.us/img40/5116/menuc.png

Chodzi o cos takiego jak na rysunku. po lewej uklad jak to wyglada obecnie po prawej tak jak ma wygladac. Mysle, ze menu jest ustawione na sztywno - ta fioletowalinia i obrazka, ktory tez nalezy do menu nie da sie przeniesc poza nia. W prawa strone obrazek mozna przeniesc bez problemu.

Nie znam sie na css, świetnie by bylo ustawic strone tak jak na wspomnianym http://www.starcraft2.net.pl/ zeby np. stopka tak nie uciekala jak mi. Pozycje relatiwe mam ustawiona wszedzie bo ponoc absolutnie sie nie powinno ustawiac... tak wyczytalem.

Wracajac do tej listy... nie wiedzialem, ze istnieje takak komenda co ja czysci, ajej nie chcialem wiec wymyslilem z tym obrazkiem przezroczystym.

malkowitch
16-05-2009, 23:01
atrybut position używać lepiej gdy się już "trochę" zna CSS i XHTML (miesiąc to za mało)

Dobrze było by zapoznać się z podstawami pozycjonowania blokami.

radzę na początek w czystym html i css zrobić kilka stronek testowych.
nadać każdemu blokowi stronki kolor i uczyć się.

jak już się uparłeś na to co tam teraz masz to spróbuj najpierw zrobić szkielet strony w html bez joomla. kazdy blok innym kolorem i sprawdzać zachowanie.

obecnie masz tam nie tyle bałagan przez css ale i przez niepozamykane tagi lub nie pełne.

bartspam
16-05-2009, 23:06
Hej uporalem sie z tym ! wystarczylo nadac position i wkleic left: -60px;

.... rece opadaja, ze sam na to nie wpadlem. Dziekowa malkowitch.

Jaj przepuszczam strone w walidatorze to pisze o jakis niezamknietych tagach (1 table oraz 1 div), ale nie moge ich znalezc a validator nie podaje bezposrednio gdzie sie te bledy znajduja. Divy w htmlu to pestka :) Ale ustawiam je tak samo jak na tej stronie. Da sie pomojemu ale pewnie to mozna zrobic inaczej lepiej... czytam czytam ale niczego ciekawego nie moge znalezc. Bardzo chetnie przesle Ci kod css ktorego uzywam, jak znajdziesz cos co moge poprawic aby lepiej to funkcjonowalo bardzo prosze o kontakt.

Pozostaje jedynie problem z podlinkami w menu, ktore po kliknieciu w nadlink (rodzica) nie pojawiaja sie.

Oczywiscie zgodnosc tej strony to tylko opera i ff w najnowszych wersjach, za ie sie nawet nie zabieram bo po roku bym tego nie zrobil. Jak ludzie robili skorki pod ie, zwlaszcza dla tych starszych wersji to mnie dziw bierze. Ja odpadam na dzien dzisiejszy.

malkowitch
16-05-2009, 23:18
Wszystko to kwestia przyzwyczajenia. Większość moich stron działa pod IE, FF, Opera i pochodne Gecko
Robiłem także raz stronię pod Safari o FF.

Jak chcesz to zarzuć gdzieś cały katalog szablonu w zip i prześlij mi link do zipa na PM

Oględnie mogę luknąć.

Wierz mi, ze position lepiej używać w ostateczności bo wiele przeglądarek ma problemy. Potrafią taki element wywalić w kosmos (częste w IE)

bartspam
17-05-2009, 03:04
PM poszedl. Na razie walcze z tym menu, pozycje itemow poustawiane ale za nic w swiecie nie pokazuja sie podlinki.

bartspam
19-05-2009, 14:25
NIe możliwoscią umnie jest ustalenie tego ze po kliknieciu na link w menu wyswietlaly sie podlinki... Ktokolwiek sie z tym spotkal i sobie poradzil, proszony jest o pomoc.

zwiastun
19-05-2009, 15:40
Bo to nie jest prosta konstrukcja. Jeśli nie jesteś wytrawnym grzebaczem w CSS, to na próżno Twoje wysiłki. A wytrawny nie zadawałby takich pytań.
Rozwijane menu masz w szablonie JAPurity (poziome). O innych pisałem razy kilka na forum.

bartspam
19-05-2009, 22:05
Aaaaa czyli rozumiem, ze joomla nie ma standardowo dodanego tego, ze jak klikniesz na AKTUALNOSCI (item2) to wyswietli sie DODAJ NEWSA (item3) oraz ARCHIWUM (item4) tak jak jest to ustawione w menu ? Trzeba do tego specjalnego dodatku ? Caly czas myslalem, ze ma i cos robie zle - bo czasami te 2 podlinki (prawidlowo, ale nie wiem czemu nie zawsze) mi sie pokazuja.

HOME (item1)
|
AKTUALNOSCI (item2)
|
--------DODAJ NEWSA (item3)
|
--------ARCHIWUM (item4)
|
GALERIA (item5)
|
LINKI (item6)

Zreszta co ma do tego kod css - jak sie menu ma rozwijac to powinno sie rozwijac... Usunalem wszystkie wpisy jakie dodalem w css - zostal sam tekst (linki menu) bez zadnych efektow w stylu obrazkow, odstepow i tez nie dziala...

jeszcze w JApurity dokladnie sprawdze (skopiuje) i poszukam podpowiedzi. Sprostujcie jak zle "mysle".

zwiastun
19-05-2009, 22:31
Może jednak sięgnij do lekturek i poczytaj, bo rozmowa na poziomie słyszałem, że dzwonią, ale nie wiem w którym kościele, sensu nie ma. I powtarzanie rzeczy opisanych również.

bartspam
20-05-2009, 22:44
"Zreszta co ma do tego kod css - jak sie menu ma rozwijac to powinno sie rozwijac... " To tyczy sie modulu menu w joomli - jezeli jest "zaprogramowany" na rozwijanie sie to niewazne co dodamy w css (grafa, pozycja) to bedzi sie rozwijal. Przegladalem szablony standardowe joomla ale bez skutku - tzn. jak ustawie na ich szablon to menu sie rozwija. Pozostaje przeinstalowanie joomli ?...

zwiastun
20-05-2009, 23:27
"Zreszta co ma do tego kod css - jak sie menu ma rozwijac to powinno sie rozwijac... "
Tako rzecze @bartspam. A co nie może? Mamy wolność do chrzanienia trzy po trzy!

bartspam
21-05-2009, 20:08
No i mialem racje, zainstalowalem strone na innym hostingu i wszystko gra ! Okazalo sie, ze na moim strona jest cachowana do pamięci ram i powstaja komplikacje, na szczescie zostanie to niedlugo rozwiazane.

bartspam
25-05-2009, 22:16
Dobra, juz mam totalna zalamke... zostalo tylko to menu do zrobienia a jednak ciagle jest cos nie tak, jak kasuje cache z przegladarki, panelu joomla to dzieje sie to ze menu nie rozjezdza sie prawidlowo, na co zwrocil mi uwage pewien uzytkownik. Przejrzalem juz chyba wszystkie topiki na necie i nic. Chce proste menu w css takie jak np. tutaj - ogolnie fajna stronka i ten webadministrator gold jest chyba bardzo podobny do joomla - http://www.starcraft2.net.pl/portal/sc2/24/Publicystyka.html (to sie chyba nazywa menu rozwijane).

Nie ukrywam, ze licze na gotowca. Oto zalozenia: Menu w czystym szablonie - nowym po prostu nowe menu, aby bylo mi to latwiej zrozumiec te parametry pogrubione moglyby byc niezmienione. NIe bawcie sie w jakies zgodnosci z przegladarka, wystarczy ze bedzie dzialac na 1 np. operze a reszte sobie dopisze. Jakis link ktory pozwoli mi to zrozumiec jak ktos zna tez bardzo chetnie !


Module Parameters

Menu Name menuleft
Menu Style LIST

Start Level 0
End Level 0
Always show sub-menu Items No

Target Position PUSTE

-----

Advanced Parameters

Show Whitespace NO

Caching USE GLOBAL

Menu Tag ID PUSTE
Menu Class Suffix PUSTE
Module Class Suffix -menuleft
Maximum Menu Depth 10

----

Other Parameters

Show Menu Images Yes
Menu Image Alignment Left
Menu Image Link Yes
Expand Menu No
Activate Parent No
Full Active Highlighting No

Indent Image TEMOPLATE
reszta default.
Indent Image 1
Indent Image 2
Indent Image 3
Indent Image 4
Indent Image 5
Indent Image 6

Aktualnosci,ktore sa "rodzicem" dla dwoch podlinkow DODAJ WIADOMOSC oraz ARCHIWUM. Potem sa LINKI i GALERIA.

Czyli

HOME (item1)
|
AKTUALNOSCI (item2)
|
--------DODAJ NEWSA (item3)
|
--------ARCHIWUM (item4)
|
GALERIA (item5)
|
LINKI (item6)

Menu w menu menager nazywa sie menu_left.

Ponizej moje dotychczasowe wypociny:


div.moduletable-menuleft h3
{
display: none;
}

div.moduletable-menuleft
{
position: relative;
top: -750px;
width: 250px;
font-size: 15px;
font-family: verdana;
font-style: normal;
font-weight: normal;
}

Jezeli chodzi o stylizowanie pozycji:

div.moduletable-menuleft .item1 /* button MENU - home */
{
height: 120px;
!!! TUTAJ NIE DZIALA left: 50xp; - o to mi chodzi miedzy innymi !!!
}

div.moduletable-menuleft .item2 /* AKTUALNOSCI */
{
background: url("../images/title_main.png") no-repeat;
text-indent: 30px;
line-height: 27px;
}

div.moduletable-menuleft .item3 /* AKTUALNOSCI - DODAJ NEWSA, podlink */
{
background: url("../images/title_sub.png") no-repeat;
}

div.moduletable-menuleft .item4 /* AKTUALNOSCI - ARCHIWUM, podlink */
{
background: url("../images/title_sub.png") no-repeat;
}

div.moduletable-menuleft .item5 /* GALERIA */
{
background: url("../images/title_sub.png") no-repeat;
text-indent: 30px;
line-height: 27px;
}

div.moduletable-menuleft .item6 /* LINKI */
{
background: url("../images/title_sub.png") no-repeat;
text-indent: 30px;
line-height: 27px;
}


div.moduletable-menuleft h3
{
display: none;
}

div.moduletable-menuleft
{
position: relative;
top: -750px;
width: 250px;
font-size: 15px;
font-family: verdana;
font-style: normal;
font-weight: normal;
list-style-image: url("../images/trans_dot.png");
/* color: #800000; */ /* okresla kolor kropeczek (ui,li) - gdy black - nie widac kropeczek (zlewa siďż˝ z tlem) */
/* background: url("../images/finals_3.png") no-repeat; */
border: 1px solid purple;
}

div.moduletable-menuleft ul li {
margin: 0 !important;
padding: 0 !important;
background: none !important;
}

div.moduletable-menuleft ul li a {
padding: 2px 0;
display: block;
color: #917A49;
background: url(../images/hdot2.gif) repeat-x bottom;
text-decoration: none;
outline: none;
}

div.moduletable-menuleft ul li a span
{

}

div.moduletable-menuleft ul li a:hover
{
color: #ddd7b1;
}

div.moduletable-menuleft ul li a:active
{
color: gray;
}

div.moduletable-menuleft ul li a:focus
{
color: #b39e79;
}

div.moduletable-menuleft ul li.active a
{
font-weight: bold;
text-decoration: none;
}

div.moduletable-menuleft ul li.active a span
{

}


div.moduletable-menuleft ul li li a span
{
background: none;
}

div.moduletable-menuleft ul li ul
{
margin: 0;
padding: 0;
list-style-image: url("../images/trans_dot.png");
}

div.moduletable-menuleft ul li li
{
padding: 0 0 0 15px !important;
list-style-image: url("../images/trans_dot.png");
}

div.moduletable-menuleft ul li li a
{
color: red;
font-size: 92%;
font-weight: normal;
}

div.moduletable-menuleft ul li li a:hover,
div.moduletable-menuleft ul li li a:active,
div.moduletable-menuleft ul li li a:focus
{
color: blue;
}

div.moduletable-menuleft ul li li a span
{
font-weight: normal;
}

Przy okazji zwiastun mial racje, kod css jest opowiedzialny za rowijanie sie menu a lista w joomli tylko temu sprzyja.

malkowitch
25-05-2009, 22:25
Wyłączyłeś maksymalny poziom (End level) to jak ma Ci się rozwijać porządnie .

Zajrzyj na ustawienia modułu menu jakie standardowo ma któryś z szablonów które dostajesz z joomla.

bartspam
26-05-2009, 01:23
Standardowe szablony polecialy juz po 1 minucie instalacji :) Jak chcesz cos zbudowac porzadnie, to musisz sam budowac. Inaczej wydaje Ci sie, ze wiesz. Chodzi mi o 1 proste menu tak jak w w tym przykladzie - to 1 (psy+koty razem lol :P). Jutro bo dzisiaj juz padam zainstalujke standardowa joomle i zobacze jak to wyglada z tymi standardowymi menu. Wydawalo mi sie ze menu takie jak w tej stronce podalem to prosta sprawa... tylko ja w kodzie css cos mieszam.

http://74.125.77.132/search?q=cache:Iios1MxeEqAJ:docs.joomla.org/Tutorial:Creating_a_submenu+menu+end+level+joomla&cd=6&hl=pl&ct=clnk&gl=pl

Dogs
|----Collies
|----Greyhounds
Cats
|----Tabbies
|----Siamese

Cos takiego w czystym szablonie (np.tylko z pozycja[modulem] menu) to przeciez nic trudnego, chodzi teraz o kod css do poprawnego wyswietlaania tego menu (zwlaszcza podlinki) abym mogl zobaczyc gdzie robie blad.

EDIT: linki

http://www.pialek.eu/blog/programming/joomla/9-creating-proper-menu-structure-in-joomla.html#yvComment9
http://docs.joomla.org/Tutorial:Creating_a_submenu

Przespie sie z tym i od rana do pracy :)

zwiastun
26-05-2009, 01:38
Załóż swojego bloga i pisz pamiętnik. To forum na pewno nie jest miejscem do takiej twórczości! Napisałem na początku. CSS nie jest wprawdzie technologię dla tych po doktoracie, ale co nieco trzeba się najpierw nauczyć samemu lub w szkole czy na kursie, żeby nękać innych. Kup sobie w księgarni np. CSS Antologia. 101 wskazówek i trików tudzież co najmniej kilka innych równie dobrych wydawnictw, jeśli Ci nie wystarcza to co jest dostępne w Sieci, a tutaj nie śmieć więcej!

bartspam
26-05-2009, 12:59
Przeciez jak by moja wiedza byla wystarczajaca to bym tu nie zadawal pytan tylko na nie odpowiadal. To forum jest po to aby zadawac pytania, przedstawilem problem tak dokladnie jak umialem, w internecie sa gotowe rozwiazania, ktore sie u mnie nie sprawdzaja :( Troche glupio, ze od razu zaczalem zabawe z czystym szablonem no ale wydaje mi sie, ze dzieki temu moja wiedza jest duzo wieksza. Pisalem, ze nie ukrywam ze licze na gotowca bo skonczyly sie wszedkie pomysly i sugestie. Jest jakas ksiazka gdzie opisuja powstawanie menu do joomli od podstaw ? Zreszta napisanie menu to tych 5 linkow to pikus dla kogos zaawansowanego, nie licze na jakies zgodnosci z przegladarkami, ani kolory + grafe tylko czysty prosty kod aby sprawdzic dlaczego u mnie to nie dziala ! Na pewno jest wiecej osob ktore maja taki sam problem, a po tak dokladnym opisaniu problemu i jego rozwiazaniu, pytan bedzie na pewno mniej. A strony w 95% sa opierane na gotowych szablonach i nie mozliwosci dla ich posiadaczy czegos przestawic, zmienic a w joomli chyba na tym to polega, ze w prosty sposob konfigurujesz witryne do swoich potrzeb.

bartspam
26-05-2009, 18:23
#navigation {
width: 200px;
font-family: Arial, Helvetica, sans-serif;
}
#navigation ul {
list-style: none;
margin: 0;
padding: 0;
}
#navigation li {
border-bottom: 1px solid #ED9F9F;
}
#navigation li a:link, #navigation li a:visited {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 12px solid #711515;
border-right: 1px solid #711515;
background-color: #B51032;
color: #FFFFFF;
text-decoration: none;
}
#navigation li a:hover {
background-color: #711515;
color: #FFFFFF;
}
#navigation ul ul {
margin-left: 12px;
}
#navigation ul ul li {
border-bottom: 1px solid #711515;
margin:0;
}
#navigation ul ul a:link, #navigation ul ul a:visited {
background-color: #ED9F9F;
color: #711515;
}
#navigation ul ul a:hover {
background-color: #711515;
color: #FFFFFF;
}


wedlug ksiazki, ktora podales: NIE dziala... sprawdzalem na jeszcze innej tez nie dziala. Sprawdzalem an 5 przykladach z netu, nie dziala... naprawde nie przychodzilbym tutaj gdyby to bylo proste do znalezienia na forach joomli albo google.

EDIT: tu kod przerobki pod moje menu:



div.moduletable-menuleft h3
{
display: none;
}

div.moduletable-menuleft
{
position: relative;
top: -750px;
width: 250px;
font-size: 15px;
font-family: verdana;
font-style: normal;
font-weight: normal;
/* color: #800000; */ /* okresla kolor kropeczek (ui,li) - gdy black - nie widac kropeczek (zlewa siďż˝ z tlem) */
/* background: url("../images/finals_3.png") no-repeat; */
border: 1px solid purple;
}


div.moduletable-menuleft ul {
list-style: none;
margin: 0;
padding: 0;
}
div.moduletable-menuleft li {
border-bottom: 1px solid #ED9F9F;
}
div.moduletable-menuleft li a:link, div.moduletable-menuleft li a:visited {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 12px solid #711515;
border-right: 1px solid #711515;
background-color: #B51032;
color: #FFFFFF;
text-decoration: none;
}
div.moduletable-menuleft li a:hover {
background-color: #711515;
color: #FFFFFF;
}
div.moduletable-menuleft ul ul {
margin-left: 12px;
}
div.moduletable-menuleft ul ul li {
border-bottom: 1px solid #711515;
margin:0;
}
div.moduletable-menuleft ul ul a:link, div.moduletable-menuleft ul ul a:visited {
background-color: #ED9F9F;
color: #711515;
}
div.moduletable-menuleft ul ul a:hover {
background-color: #711515;
color: #FFFFFF;
}

bartspam
27-05-2009, 03:12
Po bardzoooo dlugichhh bojach i zmudnych poszukiwaniach udalo mi sie rozwiazac problem !

W module z naszym menu przechodzimy do ADVENCED PARAMETERS iw Caching zaznaczamy NO CACHING.


Od tej pory caly kod css dziala i menu normalnie funkcjonuje ! Siedzialem nad tym 2 tygodnie ! MAm nadzieje, ze komus sie przyda.

bartspam
06-06-2009, 17:38
Dobra ja mialem jednak racje a zwiastun sie mylil ! JEsT narescie !!!! Chociaz jeden raz !!!! :)

Menu w joomli rozwija sie automatycznie nie potrzeb do niego zadnego kodu css (mozliwe ze w samej joomli jest jakis kod zastosowany nie wnikam juz w to - jezeli ktos wie jaki niech napisze). A wiec efekt jaki chcialem uzyskac (http://www.starcraft2.net.pl/portal/sc2/24/Publicystyka.html) jest uzyskiwany w joomli automatycznie.

Teraz odnosnie obrazu jakim ma byc link HOME w naszym menu.


div.moduletable-SUFIX NASZEGO MENU .item1 (czy to jest item jeden to musimy podejrzec w source(kodzie) strony)
{
position: relative; i dzieki temu mozemy go przesuwac w lewo/prawo np.left:100px;.
height: ustawiamy mu wysokosc dzieki ktorej reszta linkow nie bedzie sie pojawiac obok tylko pod spodem obrazu.
}

I to wszystko reszta kodu css wedlug uznania. Pozdrawiam.

bartspam
06-06-2009, 22:38
Jeden problem rozwiazany to pojalil sie nastepny :)

Co zrobic aby animowany plik gif po najechaniu odtworzyl swoja animacje od poczatku, a nie pokazywal tylko koncowy efekt ?

Dotyczy sie linka w menu, na razie mam takie cudo...

a:hover, a:focus
{
background: obraz animowany
}

zwiastun
07-06-2009, 00:27
1.

Dobra ja mialem jednak racje a zwiastun sie mylil ! JEsT narescie !!!! Chociaz jeden raz !!!! :)
Menu w joomli rozwija sie automatycznie nie potrzeb do niego zadnego kodu css...

Powtórzę po raz kolejny:
Tako rzecze @bartspam. A co nie może? Mamy wolność do chrzanienia trzy po trzy!
2. Kolejny problem - albo się naucz korzystać z forum, albo będę zmuszony dać Ci czas na naukę!

Sabinka
07-06-2009, 11:05
Podepnę się pod temat.
Mam templatkę siteground-j15-53. Wszystko jest ok, ale menu się rozjeżdża po wejściu dalej.
Kliknięcie w Kocury http://awoplast.pl/mainecoon/index.php?option=com_content&view=article&id=12&Itemid=8&lang=pl rozwija menu poprawnie (3 elementy z imionami kotów) , ale kliknięcie na którekolwiek imię kota powoduje że pozostałe dwa cofają się do tej samej linii co główny przycisk (Kocury). Jest to kwestia zapisu w css tej templatki. Nie blokuje tych pozycji.
Co mogę zmienić w tym template.css, żeby blokowały się te pozycje (tzn, by po kliknięciu, nie cofały się) i by pokazywały się z przesunięciem 3 poziomy (a nie tylko dwa)
W załączeniu plik template

zwiastun
07-06-2009, 12:32
Deklaracje CSS masz w liniach około 780
#leftcolumn ul.menu li ul li#current a, #leftcolumn ul.menu li ul li#current a:link, #leftcolumn ul.menu li ul li#current a:visited, #leftcolumn ul.menu li ul li#current a:hover
ale też i wcześniej i później - trzeba nad tym trochę posiedzieć, zwracajac uwagi na pseudoklasy: link, visited, hover, active

bartspam
07-06-2009, 21:27
1
Powtórzę po raz kolejny:
Tako rzecze @bartspam. A co nie może? Mamy wolność do chrzanienia trzy po trzy!

Zwiastun stworz menu w czystej templatce. Dziala bez zadnego kodu css odwolujacego sie do tego modulu. Wtedy przyznalem Ci racje poniewaz mialem pochrzaniony cache w przegladarce i myslalem ze miales racje.

Co do 2 problemu jest on czesciowo rozwiazany - pseudoklasa hover. Jednak jest maly problem gdy chcemy aby animacja rozpoczela sie gdy zjedziemy(oddalimy kursor) z linku menu. Jedna gdy najedziemy, 2 gdy zjedziemy. Za pomoca cs jst to chyba niemozliwe do asiagniecia.

2
2. Kolejny problem - albo się naucz korzystać z forum, albo będę zmuszony dać Ci czas na naukę!

Nie za bardzo rozumiem o co chodzi...

3 Sabinka, twoj problem to tylko i wylacznie poprawa css.

Zacznij od poczatku (jezeli piszesz menu sama) zaczunajac od 1 wartwy ul, li, wszystkie a, hover, link, potem nastepna ul ul, ul ul li itd. Najprawdopodobniej gdzies brakuje margin albo padding. Jezeli kupilas ta templatke to powinnas otrzymac pomoc za darmo i powinni szybko rozwiazac sprawe. jezeli jest darmowa, sprobuj skontaktowac sie z autorem, no powinien szybko i skutecznie rozwiazac problem - jak siedzisz kilka dni nad kodem znasz ja jak wlasna kieszen...


P.S. kociaki sa swietne :D Lancaster jak podaje lape ROX

zwiastun
08-06-2009, 02:29
Wybitny Fachowcu! Nic tylko czoła pochylić nad Twoim geniuszem. Odkryłeś bowiem coś, co z oczywistych względów zwiastunowi do głowy nie przyszło, skoro nie odkryły tego nawet wykształciuchy z W3C: nie wiedzą, że żaden CSS nie jest potrzebny, bo się samo sformatuje. Zgłoś może swoje usługi do W3C, masz szansę zostać co najmniej konsultantem samego twórcy WWW.

zwiastun
08-06-2009, 14:34
@sabinka:
1. zrób sobie kopię arkusza stylów
2. usuń deklaracje od linii 743 do linii 834
3. wstaw w ich miejsce poniższe


/*LEFT COL LINK*/
#leftcolumn ul.menu li a, #leftcolumn ul.menu li a:link,
#rightcolumn ul.menu li a, #rightcolumn ul.menu li a:link {
font-family: Georgia, Verdana, serif;
line-height: 20px;
padding: 0 0 0 14px;
text-decoration: none;
color: #333;
font-weight: normal;
font-size: 11px;
background: url(../images/menu_row.jpg) center left no-repeat;
margin: 0;
height: 20px;
display: block;
}

#leftcolumn li#current a {
color: #000;
}
#leftcolumn ul.menu li ul {
padding: 0;
margin: 0;
}
#leftcolumn ul.menu li ul li a {
background: url(../images/submenu_row.jpg) center left no-repeat;
padding: 0 0 0 24px;
list-style: none;
margin: 0;
}
#leftcolumn ul.menu li ul li ul {
padding: 0;
margin: 0;
}
#leftcolumn ul.menu li ul li ul li a{
background: url(../images/submenu2_row.jpg) center left no-repeat;
padding: 0 0 0 36px;
list-style: none;
margin: 0;
}
4. Stworz z obrazka submenu_row.jpg nowy dodatkowy obrazek submenu2_row.jpg, zwiększ jego szerokość z lewej strony o 10px i oczywiście wypełnij ten dodany fragment kolorem tła.

Sabinka
08-06-2009, 14:40
Bardzo dziekuję. Zaraz się za to zabieram

zwiastun
08-06-2009, 14:41
Odśwież odpowiedź, cos ta jeszcze poprawiałem!

Sabinka
08-06-2009, 15:05
Dziękuję.
W kocurach juz wszystko gra :-)
Ale na w miotach, Miot A - gdzie jest 6 podstron, 3 są dobrze, a kolejne 3 się źle wyświetlają http://awoplast.pl/mainecoon/index.php?option=com_content&view=article&id=46&Itemid=65&lang=pl

zwiastun
08-06-2009, 15:17
:) to już musisz sama posiedzieć - na podstawie tego co masz, wiesz mniej więcej, o co chodzi
Być może trzeba jeszcze pomanipulować pseudoklasami (:link, :visited, :hover)

Sabinka
08-06-2009, 18:23
Ok :)
Udało się :)
Jeszcze raz dziękuję