| |
|
|
| | Интересный такой вопросик появился: как узнать положение на странице ячейки таблицы, или текста, или чего-нибудь. Т.е. мне надо сделать выпадающее меню в новостях, выводимых из базы, а положение выпадающих менюшек относительно текста (при наведении на который и выпадает меню) я не смогу узнать. Или есть такие меню, где не надо указывать координаты по отношению ко всей странице? Может есть такие меню, где выпадающий список появляется четка под кнопкой (текстом), вызвавшим меню при наведении?
И ещё, может кто добрый подкинет скрипт меню с эффектом появления (alpha blending), а ещё лучше с эффектом (pixelate) как в AllWebMenus 3.1 на который нигде кряка не найти... >:(
Спасибо за внимание! ;D | |
| |
|
|
| |
|
|
| |
для: Nobody
(11.03.2005 в 01:48)
| | | > Или есть такие меню, где не надо указывать
>координаты по отношению ко всей странице? Может есть такие
>меню, где выпадающий список появляется четка под кнопкой
>(текстом), вызвавшим меню при наведении?
Может это тебе подайдёт:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Pop-up menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
<!--
.top {position: static; text-align:left; width: 61px; height:20px}
.sub {position: relative; text-align:center; visibility: hidden; border-width:1px; border-style: solid; color:#000000; background-color:#FF9900; width:78px}
a.submn {background-color: #0099FF; color: #000000; text-decoration: none; font-family: Verdana, Arial, Helvetica;
font-weight: bold; font-size: 12px; padding-top: 0px; padding-right: 0px; padding-left: 0px; padding-bottom: 0px;
margin: 0px;}
a:hover.submn {background-color: #00CCFF; color: #000000; text-decoration: none; font-family: Verdana, Arial, Helvetica;
font-weight: bold; font-size: 12px; padding-top: 0px; padding-right: 0px; padding-left: 0px; padding-bottom: 0px;
margin: 0px;}
a:active.submn {background-color: #0000FF; color: #FFFFFF; text-decoration: none; font-family: Verdana, Arial, Helvetica;
font-weight: bold; font-size: 12px; padding-top: 0px; padding-right: 0px; padding-left: 0px; padding-bottom: 0px;
margin: 0px;}
a.menu {background-color: #0099FF; color: #FFFFFF; text-decoration: none; font-family: Verdana, Arial, Helvetica;
font-weight: bold; font-size: 12px; padding-top: 1px; padding-right: 1px; padding-left: 1px; padding-bottom: 1px;
margin: 1px; border-width: 2px; border-style: solid; border-top-color: #00CCFF; border-right-color: #0066FF;
border-bottom-color: #0066FF; border-left-color: #00CCFF;}
a:hover.menu {background-color: #0099FF; color: #FFFFFF; text-decoration: none; font-family: Verdana, Arial, Helvetica;
font-weight: bold; font-size: 12px; padding-top: 1px; padding-right: 1px; padding-left: 1px; padding-bottom: 1px;
margin: 1px; border-width: 2px; border-style: solid; border-top-color: #0066FF; border-right-color: #00CCFF;
border-bottom-color: #00CCFF; border-left-color: #0066FF;}
a:active.menu {background-color: #0000FF; color: #000000; text-decoration: none; font-family: Verdana, Arial, Helvetica;
font-weight: bold; font-size: 11px; padding-top: 1px; padding-right: 1px; padding-left: 1px; padding-bottom: 1px;
margin: 1px; border-width: 3px; border-style: solid; border-top-color: #0066FF; border-right-color: #00CCFF;
border-bottom-color: #00CCFF; border-left-color: #0066FF;}
td {width: 56px; background-color:#FF9900;}
-->
</style>
<SCRIPT language="javascript">
<!--//
function cl()
{ for(var i=1; i<=1; i++)
{eval('sub'+i+'.style.visibility="hidden"')}
}
function show(num)
{cl();
eval('sub'+num+'.style.visibility="visible"');
}
//-->
</SCRIPT>
<noscript>
Ваш браузер не поддерживает JavaScript
</noscript>
</head>
<body>
<div id="top" class="top" onMouseOver="show('1')" >
<a href="page1.php" class="menu">Пункт 1</a>
</div>
<div id="sub1" class="sub" style="left:0px; top:0px; " onMouseOut="cl();">
<a class="submn" href="subpage1.php" title="Подпункт 1" onMouseOver="show('1')">Подпункт 1</a><br />
<a class="submn" href="subpage2.php" title="Подпункт 2" onMouseOver="show('1')">Подпункт 2</a><br />
<a class="submn" href="subpage3.php" title="Подпункт 3" onMouseOver="show('1')">Подпункт 3</a><br />
</div>
</body>
</html> | |
| |
|
|
| |
|
|
| |
для: ЯR
(12.03.2005 в 02:57)
| | | Ура, спасибо! :)
Только вот ещё бы научил ты меня ставить на это дело эффекты появления, тогда всё было бы просто замечательно. :)
Подскажи ещё плиз как сделать чтобы этот div появлялся с эффектом pixelate или blend. | |
| |
|
|
| |
|
|
| |
для: Nobody
(15.03.2005 в 23:31)
| | | И ещё, как сделать, чтобы DIV был поверх всего? А то он у меня занимает место в таблице с "Пункт 1", а мне надо, чтобы подпункты вылетали поверх всего. | |
| |
|
|
| |
|
|
| |
для: Nobody
(15.03.2005 в 23:34)
| | | Попробуй использовать этот код.
<DIV style="Z-INDEX: 3; LEFT: 48px; WIDTH: 200px; TOP: 203px"; POSITION: absolute >
</DIV>
|
| |
| |
|
|
| |
|
|
| |
для: Ziq
(16.03.2005 в 06:56)
| | | Нет, мне надо, чтобы DIV появлялся относительно родителя, т.е. position: relative. A absolute появляется в заданном месте экрана... | |
| |
|
|
| |
|
|
| |
для: Nobody
(15.03.2005 в 23:34)
| | | <div style="тут надо добавить(к тому что было) z-index:5">
чем больше значение z-index, тем выше слой
PS
точно не помню, но помоему z-index'ы не должны совпадать
pixelate сделать скорее всего не получится, а что за эффект blend? | |
| |
|
|
| |
|
|
| |
для: ЯR
(19.03.2005 в 04:12)
| | | Люди можете посмотреть вот это, тут собраны все эффекты.
Так же при выборке эффекта приводится и исходный код этого эффекта, ну короче говоря вещь... | |
| |
|
|
