для работы меню требуется наличие jQuery
Здраствуйте! а объясните как это установить, раз требуется наличие?
Единый форум поддержки |
Привет, Гость! Войдите или зарегистрируйтесь.
Вы здесь » Единый форум поддержки » Архив » Создаем выплывающее меню
для работы меню требуется наличие jQuery
Здраствуйте! а объясните как это установить, раз требуется наличие?
и не подскажите как меню перемещать....чтоб оно у меня повыше было....на шапку залезало
вот форум http://truecstest.mybb.ru/
извините за мою тупость...уже все нашел...удалите мои сообщения
Ещё раз напоминаю, для ВСЕХ!
Этот скрипт более устанавливать не требуется:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
Теперь он есть на каждом форуме! Если он стоит у Вас в ХТМЛ-верх или ХТМЛ-низ, удалите его.
Этот скрипт более устанавливать не требуется:
А что он дает? Я ничего нового не заметила.
здраствуйте! Помогите мне....я нашел скрипт меню, и хочу его сделать горизонтальным и переместить на шапку, подскажите какими кодами это поправить? (http://truecstest.mybb.ru/)
Отредактировано loOw (Вс, 19 Сен 2010 17:17:29)
ладно=) попрошу немного иначе=) помоги пожалуйста подкорректировать этот код чтоб он стал горизонтальным и заменить им главное меню форума
body,h1,h2,h3,p,quote,small,form,input,ul,li,ol,label{ /* Simple page reset */ margin:0px; padding:0px; } body{ /* Setting default text color, background and a font stack */ color:#cccccc; font-size:13px; background: #302b23; font-family:Arial, Helvetica, sans-serif; } ul{ margin:0; padding:0; } ul.container{ /* The topmost UL */ width:240px; margin:0 auto; padding:50px; } li{ list-style:none; text-align:left; } li.menu{ /* The main list elements */ padding:5px 0; width:100%; } li.button a{ /* The section titles */ display:block; font-family:BPreplay,Arial,Helvetica,sans-serif; font-size:21px; height:34px; overflow:hidden; padding:10px 20px 0; position:relative; width:200px; } li.button a:hover{ /* Removing the inherited underline from the titles */ text-decoration:none; } li.button a span{ /* This span acts as the right part of the section's background */ height:44px; position:absolute; right:0; top:0; width:4px; display:block; } /* Setting up different styles for each section color */ li.button a.blue{background:url(img/blue.png) repeat-x top left; color:#074384;} li.button a.blue span{ background:url(img/blue.png) repeat-x top right;} li.button a.green{background:url(img/green.png) repeat-x top left; color:#436800;} li.button a.green span{ background:url(img/green.png) repeat-x top right;} li.button a.orange{background:url(img/orange.png) repeat-x top left; color:#882e02;} li.button a.orange span{ background:url(img/orange.png) repeat-x top right;} li.button a.red{background:url(img/red.png) repeat-x top left; color:#641603;} li.button a.red span{ background:url(img/red.png) repeat-x top right;} /* The hover effects */ li.button a:hover{ background-position:bottom left;} li.button a:hover span{ background-position:bottom right;} .dropdown{ /* The expandable lists */ display:none; padding-top:5px; width:100%; } .dropdown li{ /* Each element in the expandable list */ background-color:#373128; border:1px solid #40392C; color:#CCCCCC; margin:5px 0; padding:4px 18px; } /* The styles below are only necessary for the demo page */ h1{ font-family:"Myriad Pro",Arial,Helvetica,sans-serif; font-size:36px; font-weight:normal; margin-bottom:15px; } h2{ font-family:"Myriad Pro",Arial,Helvetica,sans-serif; font-size:12px; font-weight:normal; padding-right:140px; right:0; text-align:right; text-transform:uppercase; top:15px; } .clear{ clear:both; } #main{ /* The main container */ margin:15px auto; text-align:center; width:920px; position:relative; } a, a:visited { color:#0196e3; text-decoration:none; outline:none; } a:hover{ text-decoration:underline; } p{ /* The tut info on the bottom of the page */ padding:10px; text-align:center; }
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="jquery.easing.1.3.js"></script> <script type="text/javascript" src="script.js"></script> </head> <body> <div id="main"> <ul class="container"> <li class="menu"> <ul> <li class="button"><a href="#" class="green">Kiwis <span></span></a></li> <li class="dropdown"> <ul> <li><a href="#" onclick="$('.button a').eq(2).click();return false;">Open Grapes Section</a></li> <li><a href="#" onclick="$('.dropdown').slideUp('slow');return false;">Close This Section</a></li> <li><a href="http://en.wikipedia.org/wiki/Kiwifruit">Read on Wikipedia</a></li> <li><a href="http://www.flickr.com/search/?w=all&q=kiwi&m=text">Flickr Stream</a></li> </ul> </li> </ul> </li> <li class="menu"> <ul> <li class="button"><a href="#" class="orange">Oranges <span></span></a></li> <li class="dropdown"> <ul> <li><a href="#" onclick="$('.button a:last').click();return false;">Open Last Section</a></li> <li><a href="http://en.wikipedia.org/wiki/Orange_%28fruit%29">Wikipedia Page</a></li> <li><a href="http://www.flickr.com/search/?w=all&q=oranges&m=text">Flickr Photos</a></li> </ul> </li> </ul> </li> <li class="menu"> <ul> <li class="button"><a href="#" class="blue">Grapes <span></span></a></li> <li class="dropdown"> <ul> <li><a href="http://en.wikipedia.org/wiki/Grapes">Wiki page</a></li> <li>Text label 1</li> <li>Text label 2</li> <li><a href="http://www.flickr.com/search/?w=all&q=grapes&m=text">Flickr Stream</a></li> </ul> </li> </ul> </li> <li class="menu"> <ul> <li class="button"><a href="#" class="red">Strawberries <span></span></a></li> <li class="dropdown"> <ul> <li><a href="http://en.wikipedia.org/wiki/Strawberry">Wiki page</a></li> <li><a href="http://www.flickr.com/photos/mojeecat/368540120/">Strawberry Pie</a></li> <li><a href="http://www.flickr.com/search/?w=all&q=strawberries&m=text">Photo Stream</a></li> </ul> </li> </ul> </li> </ul> <div class="clear"></div> </div>
Установил Выпадающее главное меню. v3. В целом всё нормально, но, никак не удаётся добиться желаемого результата
1. Пункты меню(Форум, участники, поиск, профиль и т.д.) у меня на разных уровнях. Также хотелось бы, чтоб пункты отражались не CapLooks, а просто начинались с большой буквы
2. Хотелось бы, чтоб верхний срез выпадающего меню находился на уровне нижнего среза самого меню. По возможности туда же и треуголники перенести
3. Не удалось внедрить 2-й вариант(Звуковой) Системы оповещения о новом личном сообщении
4. Всплывающее меню у меня залазит под плеер
Вот скрин
Html верх(Низ не трогал
<style type="text/css"> #pun-navlinks.section{ display: block; position: relative; z-index: 1000; left: 0em; opacity: 1; filter: alpha(opacity=90); } #pun-navlinks.section ul.container { margin: 0px; border: 0px; padding: 0px; width: 800px; /*For KHTML*/ list-style: none; height: 38px; } #pun-navlinks.section ul.container, #pun-navlinks.section ul.container * {z-index: 1000;} #pun-navlinks.section ul.container li { margin: 18px 0px 0px 0px; padding: 0px; border: 0px; float: left; /*For Gecko*/ display: inline; list-style: none; position: relative; height: 12px; } #pun-navlinks.section ul.container ul { margin: 0px; border: 0px; padding: 0px 0px 12px 0px; width: 155px; list-style: none; display: none; position: absolute; top: 15px; left: -5px; background-image: url(http://savepic.net/207547.gif); background-repeat: no-repeat; background-position: 0 bottom; } #pun-navlinks.section ul.container ul:after /*From IE 7 lack of compliance*/{ clear: both; display: block; font: bold 11px Verdana; content: "."; height: 0; visibility: hidden; } #pun-navlinks.section ul.container ul li { width: 155px; float: left; /*For IE 7 lack of compliance*/ display: block !important; display: inline; /*For IE*/ } /* Root Menu */ #pun-navlinks.section ul.container a { -x-system-font:none; background-attachment:scroll; background-image:none; background-position:0 0; background-repeat:repeat; color: #000000; display:block; float:left; font-family:arial,Verdana,Helvetica,sans-serif; font-size:11px; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:normal; height:auto !important; line-height:0px; padding:0 0 0 30px; text-decoration:none; text-transform:uppercase; } /* Root Menu Hover Persistence */ #pun-navlinks.section ul.container a:hover, #pun-navlinks.section ul.container li:hover a, #pun-navlinks.section ul.container li.iehover a { color: #FF0000; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; } /* 2nd Menu */ #pun-navlinks.section ul.container li:hover li a, #pun-navlinks.section ul.container li.iehover li a { float: left; bbackground: #FAD85B; color: #000; } /* 2nd Menu Hover Persistence */ #pun-navlinks.section ul.container li:hover li a:hover, #pun-navlinks.section ul.container li:hover li:hover a, #pun-navlinks.section ul.container li.iehover li a:hover, #pun-navlinks.section ul.container li.iehover li.iehover a { background: #555555; color: #FF0000; } /* Do Not Move - Must Come Before display:block for Gecko */ #pun-navlinks.section ul.container li:hover ul ul, #pun-navlinks.section ul.container li:hover ul ul ul, #pun-navlinks.section ul.container li.iehover ul ul, #pun-navlinks.section ul.container li.iehover ul ul ul { display: none; } #pun-navlinks.section ul.container li:hover ul, #pun-navlinks.section ul.container ul li:hover ul, #pun-navlinks.section ul.container ul ul li:hover ul, #pun-navlinks.section ul.container li.iehover ul, #pun-navlinks.section ul.container ul li.iehover ul, #pun-navlinks.section ul.container ul ul li.iehover ul { display: block; } #pun-break1, #pun-break2{display: none;} #pun-announcement,#pun-announcement *{z-index: 1;} </style>
Вот сайт
http://majoras.topbb.ru/
Посмотрите, пожалуйста!
И по возможности помогите
Отредактировано majoras (Пт, 19 Ноя 2010 17:42:07)
Установил Выпадающее главное меню. v3. В целом всё нормально, но, никак не удаётся добиться желаемого результата
нинаю, я ненаблюдаю его ни в Опере ни в мазиле ни в ие, в Ие6-7
так ваще никаго меню нет. В Опере не видно и самого форума из-за некорректного кода:
<object id="mainpagemajoras" type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_multi.swf" width="200" height="100">
<param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_multi.swf" />
<param name="bgcolor" value="#ffffff" />
<param name="FlashVars" value="mp3=http%3A//www.filekeeper.org/download/shared/James_Last_-_The_lonely_sheepheard.mp3|http%3A//www.filekeeper.org/download/shared/Blonker_-_Sidewalk_cafe.MP3|http%3A//www.filekeeper.org/download/shared/Ocarina_-_Song_of_Ocarina.MP3&autoplay=1&loop=1&shuffle=2& />
Вот такие пироги
Отредактировано Deff (Пт, 19 Ноя 2010 17:48:33)
Извините, а можно спросить?
Я тут решила сделать таблицу. Можно сделать чтоб она была как одна единая? Ну вот пример:
Чтоб, когда на одного котёнка нажимаешь появлялся один текст, на другого другой текст. Можно ли так сделать?
Заранее спасибо.
Отредактировано AngelWolf (Пт, 19 Ноя 2010 19:33:12)
AngelWolf
Здравствуйте
Наверное, Вам нужен скрипт выплывающих контейнеров. Поройтесь в скриптах МайББ
AngelWolf
Здравствуйте.
Извините, а можно спросить?Я тут решила сделать таблицу. Можно сделать чтоб она была как одна единая? Ну вот пример: Чтоб, когда на одного котёнка нажимаешь появлялся один текст, на другого другой текст. Можно ли так сделать?Заранее спасибо.
Посмотрите здесь: Выпадающее меню для форума.
Стилл
да, да)) это я знаю и знаю, как сделать. Но там не получается сделать всё единой картинкой. А мне нужно именно чтобы:
Чтоб, когда на одного котёнка нажимаешь появлялся один текст, на другого другой текст
rps
нет. это не то. не получается так, как я хочу...
AngelWolf
Отписывайтесь в таблицах сделаем, но не сейчас... в начале недели следущей
AngelWolf
А разве 251 сообщение из той темы Вам не подходит?
нинаю, я ненаблюдаю его ни в Опере ни в мазиле ни в ие, в Ие6-7
так ваще никаго меню нет. В Опере не видно и самого форума из-за некорректного кода:
На Mozilla делал. Всё отражается
Насчёт 2-х остальных - согласен
Помогите кто нибудь, пожалуйста
из-за некорректного кода:
Какого кода?
Можно по-конкретнее?
Отредактировано majoras (Сб, 20 Ноя 2010 01:06:30)
majoras не наю - мне лень разбирацо -> код меню на 4 кнопки, которым я пользовался
<style type="text/css"> #part1,#part2,#part3,#part4 { z-index: 2; position: absolute; background: url(http://s40.radikal.ru/i089/1009/c5/a03ded758c11.png); border: 1px dotted #002000; font-size: 10px; visibility: hidden} </style> <table width="100%" border="0"> <tr> <td width="25%"><div align="center"><a href="" onMouseOver="part1ON()" onMouseOut="part1OFF()"><img src="http://s002.radikal.ru/i200/1009/8a/3d27517ce117.png" alt="Новости"></a> </div> <div id="part1" style="height: auto; width:200px" onMouseOver="part1ON()" onMouseOut="part1OFF()"> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p> </div></td> <td width="25%"><div align="center"><a href="" onMouseOver="part2ON()" onMouseOut="part2OFF()"><img src="http://s004.radikal.ru/i208/1009/80/7773b6f81eed.png" alt="Администрация"></a> </div> <div id=part2 style="height: auto; width:200px"><div align="center"onMouseOver="part2ON()" onMouseOut="part2OFF()"> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p> </div></td> <td width="25%"><div align="center"><a href="" onMouseOver="part3ON()" onMouseOut="part3OFF()"><img src="http://s41.radikal.ru/i092/1009/fa/33f2106b1f63.png" alt="ссылки"></a> </div> <div id="part3" style="height: auto; width:200px" onMouseOver="part3ON()" onMouseOut="part3OFF()"> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p> </div></td> <td width="25%"><div align="center"><a href="" onMouseOver="part4ON()" onMouseOut="part4OFF()"><img src="http://s61.radikal.ru/i173/1009/4b/29e730f8771e.png" alt="игра"></a></div> <div id="part4" style="height: auto; width:200px" onMouseOver="part4ON()" onMouseOut="part4OFF()"> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p><br> <p align="center"><a href="Адрес"><b><i>Ссылка</i></b></a></p> </div></td> </tr> </table> <script language="JavaScript"> function part1ON() {document.getElementById("part1").style.visibility='visible'} function part2ON(){document.getElementById("part2").style.visibility='visible'} function part3ON(){document.getElementById("part3").style.visibility='visible'} function part4ON(){document.getElementById("part4").style.visibility='visible'} function part1OFF() {document.getElementById("part1").style.visibility='hidden'} function part2OFF(){document.getElementById("part2").style.visibility='hidden'} function part3OFF(){document.getElementById("part3").style.visibility='hidden'} function part4OFF(){document.getElementById("part4").style.visibility='hidden'} </script>
А разве 251 сообщение из той темы Вам не подходит?
Нет, что-то не то опять же.
Посмотрите, пожалуйста!
И по возможности помогите
majoras
я подчистил ваш форум
добавил недостающее, убрал лишнее, теперь всё вроде бы так как вы хотели
Вы здесь » Единый форум поддержки » Архив » Создаем выплывающее меню