|
|
|
| Столкнулась с такой проблемой, я как новичёк не могу понять как сделать так, чтобы если напрмер меню слева страницы, то чтобы результат выбора пункта меню отображался справа, меню при этом не исчезало и не открывалось новое окно поверх меню, как это сейчас у меня происходит.
Меню на css. Надеюсь я понятно объяснила...:) | |
|
|
|
|
|
|
|
для: lilu
(25.08.2006 в 10:37)
| | не очень. нужен пример. | |
|
|
|
|
|
|
|
для: AlexSol
(25.08.2006 в 10:43)
| | Рискну предположить что в меню ссылки открываются с атрибутом target="_blank" (или new).
А вообще, AlexSol прав - пример нужен. | |
|
|
|
|
|
|
|
для: targa
(25.08.2006 в 11:11)
| | хорошо с примером...
вот моё меню на css
#menu ul{
margin:0; padding:0; list-style:none; width:248px; background-color:#4984BF;
#menu ul a.menu_ul{
background-image: url(/images//fon.gif);
height:50px; font-family: "Franklin Gothic Medium";
color:white; text-indent: 60px; text-align: right; style:italic; font-size: 14px;
}
#menu ul li { position: relative; }
#menu li ul { position: absolute; right: 248px; top: 0; display: block; width:100px; }
#menu li:hover ul { display: block; }
#menu li:hover>ul { visibility:visible; }
#menu ul ul {visibility:hidden; }
#menu ul, li {margin: 0 0 0 0; }
#menu ul a { display: block; text-decoration: none; color: #777; padding: 0; border-bottom: 0; }
#menu ul a.menu1{color:white; font-family: "Franklin Gothic Medium"; height:15px; style:italic; font-size: 11.5px; background: #6D99C6;}
#menu ul a:hover.menu1{background: #4984BF; color:white;}
#menu li ul a { text-decoration: none; color: #77F; background: #fff; padding: 5px; border-bottom: 0; }
#car {width: 248px;height: 50px; background-position: 0px 0px; }
#car:hover {background-color: #6D99C6; color:#BE5D07;}
#dom {width: 248px;height: 50px; background-position: 0 -50px;}
#dom:hover {background-color: #6D99C6;}
..... и т.д. аж 10 пунктов меню каждый раз опускаются на 50 px вниз и таких образом при вызове тега menu ul li они все выводятся.
|
и его я так вывожу уже в таблице (это будет потом понятно)
вотт таблица кот. я заполняю графикой и меню еств-но в левой стороне:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr><td>тут шапка с логотипом</td></tr>
<tr><td>вот здесь меню выводим
<div id="menu"> <ul>
<?
$cat = mysql_query("SELECT * FROM table1");
if(!$cat) exit(mysql_error());
while($catalog = mysql_fetch_array($cat))
{ echo"
<li><a class='menu_ul' id='$catalog[css_name]' href='#' name='submenu'>$catalog[textR]</a>
<ul>
<li> <a class='menu1' href='mainS.php?idR=$catalog[idR]'> просмотреть</a></li>
<li><a class='menu1' href='mainP.php?idR=$catalog[idR]'> добавить</a></li>
</ul>
</li>"; }
?>
</ul>
</div>
</td><td>вот здесь должен выводиться результат выбора меню, а он выводится в первой колонке</td></tr>
</table>
|
Чтобы заработало подменю (просмотреть и добавить на каждый пунк меню)
я такой скрипт, вот наверное в нём и фишка:
<script type="text/javascript">
startList = function() {
// code for IE
if(!document.body.currentStyle) return;
var subs = document.getElementsByName('submenu');
for(var i=0; i<subs.length; i++) {
var li = subs[i].parentNode;
if(li && li.lastChild.style) {
li.onmouseover = function() {
this.lastChild.style.visibility = 'visible';
}
li.onmouseout = function() {
this.lastChild.style.visibility = 'hidden';
}
}
}
}
window.onload=startList;
</script>
|
Объясните, пожалуйста что где не так .... | |
|
|
|
|
|
|
|
для: lilu
(25.08.2006 в 10:37)
| | фреймы, или ajax | |
|
|
|
|
|
|
|
для: CrazyAngel
(25.08.2006 в 11:30)
| | У тебя в опере или Firefoxe работает правильно или нет?
У меня нет в ЛИСЕ выпадения пунктов подменю просмотреть - добавить.
Есть ошибки в коде CSS. После #menu ul{ нет закрывающей скобки.
немного исправил
<STYLE type='text/css'>
#menu ul{
margin:0; padding:0; list-style:none; width:248px; background-color:#4984BF;}
#menu ul li {
position: relative;
}
* #menu html ul li { float: left; height: 1%; }
* #menu ul li a { height: 1%; }
#menu li ul { position: absolute; left: 248px; top: 0; display: none; width:100px; }
#menu li:hover ul { display: block; }
#menu li:hover>ul { visibility:visible; }
#menu ul ul {visibility:hidden; }
#menu ul, li {margin: 0 0 0 0; }
#menu ul a { display: block; text-decoration: none; color: #777; padding: 0; border-bottom: 0; }
#menu ul a.menu1{color:white; font-family: "Franklin Gothic Medium"; height:15px; style:italic; font-size: 11.5px; background: #6D99C6;}
#menu ul a:hover.menu1{background: #4984BF; color:white;}
#menu li ul a { text-decoration: none; color: #77F; background: #fff; padding: 5px; border-bottom: 0; }
</style>
|
| |
|
|
|
|
|
|
|
для: куч1963
(25.08.2006 в 13:21)
| | Да всё работает я же не всё кинула, но проблема в другом....
Меню работает точно везде и в опере и в мозиле и в ie | |
|
|
|
|
|
|
|
для: lilu
(25.08.2006 в 13:27)
| | а может вы сделаете аттачем( в виде html,css,javascript)?
чтоб посмотрет можно было | |
|
|
|
|
|
|
|
для: AlexSol
(25.08.2006 в 13:33)
| | Я не пойму смысла этой строки
#menu li ul { position: absolute; right: 248px; top: 0; display: block; width:100px; } ? | |
|
|
|
|
|
|
|
для: куч1963
(25.08.2006 в 14:22)
| | ну не надо к меню цепляться вот представьте что там набор ссылок, нажимая на любую чтобы результат рядышком отображался или внизу, но не открывалось новое окно поверх этого же.....
Я даже пример нашла вот скрипт
<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
function showPage(numPage) {
var curPage = 0;
while (1) {curPage ++; var divElem = document.getElementById("page" + curPage);
if (divElem == null)
break;
divElem.style.display = (curPage == numPage) ? "block" : "none";
}
return false;
}
</script>
|
вот я его применяю к своему примеру
.....
<li> <a class='menu1' href='mainS.php?idR=$catalog[idR]' onclick='return showPage(1);'> просмотреть</a></li>
....
и вызываю эту page1
.....
<td valign="top"><div id="page1" style="display:none;">
<? echo "55555"; ?>
</div></td>
.....
|
работает как надо - пишет справа 55555 менюшка остаётся слева, этот принцип понятен, но у меня 'mainS.php?idR=$catalog[idR]' (в mainS по idR) вот здесь и проблема | |
|
|
|
|
|
|
|
для: lilu
(25.08.2006 в 16:01)
| | Где 'mainS.php?idR=$catalog[idR]', вместо 55555 ? | |
|
|
|
|
|
|
|
для: lilu
(25.08.2006 в 13:27)
| | Проблема в том, что подуровень открывается на расстоянии, а при переходе мыши к нему он успевает закрыться?
Вообще, меню (с открыванием по наведению мыши) - это тонкая материя, если что-то меняется в их структуре, надо писать заново или хорошо понимать механизм распространения событий по структуре меню.
Через 1-2 недели хочу написать статью про меню с наведением мыши, где раскроются эти тонкости, которые нужны для разработки или переделки. | |
|
|
|