Russian TYPO3 community

Russian TYPO3 community (http://forum.typo3.ru/index.php)
-   TypoScript практикум (http://forum.typo3.ru/forumdisplay.php?f=27)
-   -   меню с rollover картинками (http://forum.typo3.ru/showthread.php?t=1839)

Vladimir_ 25.09.2006 13:49

меню с rollover картинками
 
Всем доброго времени суток!!!
Прежде всего хочу извинится, если мой вопрос покажется через чур глупым, но к сожалению дока и примеры (в том числе из разных форумов) мне не помогли
задача:
- добавить меню с ссылками на соответствующие странички
- меню остоют из картинок, которые при наведении на них курсора мыши меняются на другие
- картинки уже существуют, формировать их не нужно; нужно всего лишь что бы в тэг <img src=... был добавлен код onmouseover=... и onmouseout
- при этом также требуется обрабатывать url и получать из него значение переменной id и отображать меню, в котором картинка на с ссылкой на страничку с таким же id не содержала бы событий onmouseover=... и onmouseout

я всегда работал с php, и на php это всё делается за три секунды, с typo3 я бьюсь головой об стену уже третью неделю, толку никакого.. ну почти никакого..

результат достигнутый на сегодняшний день выглядит вот так

subparts.CONTENT < styles.content.get

subparts.MENU = HMENU
subparts.MENU.1 = GMENU
subparts.MENU.1.NO {
XY = [4.w],[4.h]
4 = IMAGE
4.file = fileadmin/images/m1.gif

allWrap = <td style="color: #FFFFFF;"> | </td>
}

subparts.MENU.1.RO < subparts.MENU.1.NO
subparts.MENU.1.RO = 1
subparts.MENU.1.RO {
4= IMAGE
4.file = fileadmin/images/m1_.gif
}


но(!), во-первых здесь выводится одна и таже картинка для всех пунктов меню (тоже самое и с rollover картинкой), мало того.. rollover картинка отображается вообще не правильно.. почему то сжата по вертикали..

П.С.: я с cms не работал, однако посмотрел mambo, joomla, дошёл в них до меню и вообще ничего не смог сделать, в typo3 хоть что то удалось но для этого понадобилось 3 недели... ужас..... Я начал осваивать cms в надежде что они упростят мою жизнь, а пока что они мне настолько всё усложнили, что я уже реально подумываю о написании собственной cms, так как вижу, что авторы существующих cms совершенно не понимают для чего cms нужны.. а опыт написания "почти cms" уже имеется, я вначале тоже использовал схожий подход.. но когда дошло до взаимодействия с реальными пользователями, увидел как нужно правильно делать, но на это требуется много времени и решил воспользоваться готовым решением.. но.. пока что это готовое решение меня озадачило по полной программе.. никогда ещё не приходилось так трудно осваивать ПО.. нервы на пределе

Pavel Antonov 25.09.2006 15:40

Цитата:

Сообщение от Vladimir_
.......
воспользоваться готовым решением.. но.. пока что это готовое решение меня озадачило по полной программе.. никогда ещё не приходилось так трудно осваивать ПО.. нервы на пределе

Мыслите шире...

Каждая страница имеет поле media. Его можно для картинок в меню и кроме того это позволяет менять картинки в BE.
Берите путь к картинке из поля media:
Код:

10 = IMAGE
10 {
  file {
    import = uploads/media/
    import.field = media
    import.listNum = 0
}

listNum - выбирает картинку из всех прикрепленных к странице по номеру. Соответственно для rollover выбираете 2-ю картинку (listNum = 1)

GMENU использовать совсем не зачем тоже... используйте TMENU. Или вы будете что-то писать поверх картинки?

Vladimir_ 25.09.2006 16:05

нет, поверх картинки я ничего писать не буду
стал использовать GMENU, так как не разобрался как отключить вывод имени страницы в TMENU (имеется ввиду что в TMENU typo3 генерил код вида <a href="somehost?id=5">about</a>, а about это имя одной из подстраничек)

Pavel Antonov 26.09.2006 15:09

Цитата:

Сообщение от Vladimir_
нет, поверх картинки я ничего писать не буду
стал использовать GMENU, так как не разобрался как отключить вывод имени страницы в TMENU (имеется ввиду что в TMENU typo3 генерил код вида <a href="somehost?id=5">about</a>, а about это имя одной из подстраничек)

Там есть stdWrap для текста ссылки. Если там подменять контент, то вывода пункта меню не будет (будет заменятся на резульат stdWrap):

Код:

1.NO {
  stdWrap.cObject = IMAGE
  stdWrap.cObject {
      file.import = uploads/media/
      file.import.field = media
      file.import.listNum = 0
    }
}


Vladimir_ 26.09.2006 16:43

ну и я тогда уже совсем обнаглею и задам ещё один вопрос в продолжении темы ;)
хорошо, допустим я использую stdWrap для подмены контента
но (!) было бы замечательно если бы я мог ещё и для каждого пункта свой тэг вставлять, т.е., например для пункта 1:
<img src="fileadmin/images/m1.jpg" id="m1" onmouseover="document.images['m1'].src='fileadmin/images/m1_.jpg';" onmouseout="document.images['m1'].src='fileadmin/images/m1.jpg';" border="0">
для пункта 2 соответсвенно:
<img src="fileadmin/images/m2.jpg" id="m2" onmouseover="document.images['m2'].src='fileadmin/images/m2_.jpg';" onmouseout="document.images['m2'].src='fileadmin/images/m2.jpg';" border="0">
и т.д.
вы уже обратили внимание что имена файлов различаются всего лишь цифрами.. ведь если я правильно понимаю формировнаие пунктов происходит в цикле.. (если ошибаюсь прошу меня извинить).. было бы замечательно подставлять в строку
<img src="fileadmin/images/m... номерочек пункта меню
так можно?

П.С.: ещё раз прошу прощения за.. практически использование форума в целях перенесения сайта в typo3, хочу ещё раз повторить что я только приступил к его осваению и к сожалению самостоятельно задачи с меню решить не смог.. и думаю наличие в инете инфы о решении такого распространённого метода формирования меню всем новичкам в typo3 очень поможет

П.П.С.: задам сразу следующий вопрос.. мне затем понадобиться формировтаь меню и подставлять вместо названия страничек русские названия пунктов, как я понимаю это делается через stdWrap, однако тоже не совсем ясно.. ведь у каждого пункта своё имя.. если можно поясните

Pavel Antonov 26.09.2006 17:10

Во-первых, это не совсем цикл. Это итерация по элементам и зависите вы от элементов. Так что и используйте их для идентификации картинок/ссылок/клссов/ид. Можно конечно и нумерацию организовать (через LOAD_REGISTER), но тогда при изменении порядка страниц, у Вас и картинки все поедут к черту.

Вот пример из одного проекта:
Код:

lib.mainMenu = HMENU
lib.mainMenu {
  maxItems = 8
  1 = TMENU
  1 {
    noBlur = 1
    NO{
ATagTitle.field = title
stdWrap.override = <img alt="spacer" src="fileadmin/templates/img/spacer.gif" />
allStdWrap {
  preCObject = TEXT
  preCObject.field = subtitle
  preCObject.wrap = <div class="upmenu" id="|">
  postCObject = TEXT
  postCObject.value = </div>
}
    }
  }
}

Генерит что то подобное:
<div class="upmenu" id="m1"><a href="index.php?id=18"><img alt="spacer" src="fileadmin/templates/img/spacer.gif" /></a></div><div class="upmenu" id="m2"><a href="index.php?id=23"><img src="fileadmin/templates/img/spacer.gif" /></a></div><div class="upmenu" id="m3"><a href="index.php?id=9"><img src="fileadmin/templates/img/spacer.gif" /></a></div>...</div><div class="cleaner"><!-- cleaner --></div>

Значения m1, m2, ... , берутся из поля subtitle страницы (используйте какое хотите). Я думаю уж код под себя подогнать сможете...

Vladimir_ 02.10.2006 16:23

и всё таки... как не грустно, но.. typoscript всё таки не тривиальный язык и руководство по нему.. хм, хм, мягко говоря не самое замечательное
мытарства по поводу ршения задачи, как же исключить вывод названий страниц, ни к чему не привили, в результате пришлось вернуться на форум..
люди, добрые, скажите же, как мне это добиться используя следующий код
page = PAGE
page.typeNum = 0

page.10 = TEMPLATE
page.10 {
template = FILE
template.file = fileadmin/tmpl.html

subparts.CONTENT < styles.content.get

ATagTitle.field =
subparts.MENU = HMENU
subparts.MENU.1 = TMENU
subparts.MENU.1.NO {
subst_elementUid = 1
allWrap = <td style="color: #FFFFFF;"><img src="fileadmin/images/menu/m{elementUid}.jpg"> | </td>
}

если можно, конкретную строку напишите..

Vladimir_ 03.10.2006 12:12

моё собственное решение сейчас выглядит вот так
subparts.MENU = HMENU
subparts.MENU.1 = TMENU
subparts.MENU.1.NO {
doNotShowLink = 1
subst_elementUid = 1
allWrap = <td style="color: #FFFFFF;"><a href="?id={elementUid}"><img src="fileadmin/images/menu/m{elementUid}.jpg" id="m{elementUid}" onmouseover="document.images['m{elementUid}'].src='fileadmin/images/menu/m{elementUid}_.jpg';" onmouseout="document.images['m{elementUid}'].src='fileadmin/images/menu/m{elementUid}.jpg';" border="0"> | </a></td>
}

критикуйте.. советуйте (маны читать не советуйте :) читаю, а вот грамотного чела знающего typo3 явно не хватает)

Pavel Antonov 03.10.2006 12:47

Цитата:

Сообщение от Vladimir_
моё собственное решение сейчас выглядит вот так
subparts.MENU = HMENU
subparts.MENU.1 = TMENU
subparts.MENU.1.NO {
doNotShowLink = 1
subst_elementUid = 1
allWrap = <td style="color: #FFFFFF;"><a href="?id={elementUid}"><img src="fileadmin/images/menu/m{elementUid}.jpg" id="m{elementUid}" onmouseover="document.images['m{elementUid}'].src='fileadmin/images/menu/m{elementUid}_.jpg';" onmouseout="document.images['m{elementUid}'].src='fileadmin/images/menu/m{elementUid}.jpg';" border="0"> | </a></td>
}

критикуйте.. советуйте (маны читать не советуйте :) читаю, а вот грамотного чела знающего typo3 явно не хватает)

CSS получается завязан на ID-страниц. По-моему мнению не очень хорошо... но работоспособно.

martis27 16.11.2006 14:22

Zdrastvuitie,
A niznajite li vy, kak pokazyvat tolko opredelionyje punkty meniu?
Ja pisu vot tak:

NO {
allWrap = <tr><td ......id="subMenuID{elementUid}">|</td></tr>
ATagParams = class="topMenuTxtSubItem"
RO=1
RO_chBgColor = #ffdd04 | #ffffff | subMenuID
subst_elementUid = 1
}
NO.if{
value=112,114,443,354 #Vot tolko tokije punkty ja hociu pokazyvat
isInList = {elementUid}
}

No u menia 2 problemy. NO.if kazetsa sovsem nerabotajet, daze jiesli ja napisu tak:
NO.if{
negate = 1
}
vseravno pokazyvajet vse punkty, hotia kazetsa sto v etom slucaje menu punkty sovsem ne dolzny byli byt pokazanymi.

I vtoroj vopros: kad dobratsa do etoij znacieniji elementUid v "if"?
Pravilno ja li napisal isInList = {elementUid}?

P.S. Izvinitie za moi alfavit.


Часовой пояс GMT +4, время: 08:07.

Работает на vBulletin® версия 3.8.1.
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Перевод: zCarot