Mod. Gotowe < [ 1.9.5 ] - Enchanced Menu by Matrix 1.3
nasedo - 10-08-2005, 15:12
Temat postu: Enchanced Menu by Matrix 1.3
Enchanced Menu by Matrix 1.3
Autor: They
Opis: Wyświetla menu po lewej stronie, okno wyskakuje i schowa sie menu po najechaniu myszą.
Download: http://www.przemo.org/php...tion=file&id=71
<hr>
W tym temacie zadajemy pytania dotyczace tylko i wyłącznie tego moda.
W przypadku aktualizacji hacka, lub wersji forum, autorów modyfikacji prosze o zamieszczanie w zalacznikach instrukcji do nowej wersji, zostanie ona przeniesiona do download.
Solinarius - 10-10-2005, 10:30
hmm, z tego co pamietam mod nie działał pod firefoxem, czy coś się zmieniło, albo ktoś widział podobne menu pod ff 
forumvm - 11-10-2005, 15:22
Własnie da się coś zrobić z tym aby działało pod FF?
lub czy ktoś widział podobne menu pod FF?
alferx - 09-12-2005, 08:08
Temat postu: Obsługa menu w FF1+
Witam,
przerobiłem trochę koda overall_header.tpl by działało pod FF1+
| Kod: |
<style type="text/css">
<!--
#master {position:absolute; width: 200px; top: 10px; left: -150px; z-index:2; visibility:visible;}
#menu {position:absolute; width: 18px; top: 6px; left: 150px; z-index:5; visibility:visible;}
#top {position:absolute; width: 150px; top: 0px; left: 0px; z-index:5; visibility:visible;}
#screen {position:absolute; width: 150px; top: 6px; left: -30px; z-index:5; visibility:visible;}
#screenlinks {position:absolute; width: 180px; top: 6px; left: -30px; z-index:5; visibility:visible;}
-->
</style>
<style type="text/css">
<!--
.NavJump {font-family: arial; font-size: 10pt; color: #808080; text-decoration: none;}
a:link.NavJump {color : #808080;}
a:visited.NavJump {color : #808080;}
a:active.NavJump {text-decoration: none; color: #000080;}
a:hover.NavJump {text-decoration: none; color: #000080;}
-->
</style>
<script language = "javascript">
<!--
var ie = document.all ? 1 : 0
var ns = document.layers ? 1 : 0
var ns6 = document.getElementById && !document.all ? 1 : 0
if(ie){
document.write('<style type="text/css">')
document.write("#screen {filter:Alpha(Opacity=100);}")
document.write("</style>")
}
if(ns){
document.write('<style type="text/css">')
document.write("#master {clip:rect(0,150,250,0);}")
document.write("</style>")
}
//-->
</script>
<script language = "javascript">
<!--
var ie = document.all ? 1 : 0
var ns = document.layers ? 1 : 0
var ns6 = document.getElementById && !document.all ? 1 : 0
var master = new Object("element")
master.curLeft = -150; master.curTop = 10;
master.gapLeft = 0; master.gapTop = 0;
master.timer = null;
function moveAlong(layerName, paceLeft, paceTop, fromLeft, fromTop){
clearTimeout(eval(layerName).timer)
if(eval(layerName).curLeft != fromLeft){
if((Math.max(eval(layerName).curLeft, fromLeft) - Math.min(eval(layerName).curLeft, fromLeft)) < paceLeft){eval(layerName).curLeft = fromLeft}
else if(eval(layerName).curLeft < fromLeft){eval(layerName).curLeft = eval(layerName).curLeft + paceLeft}
else if(eval(layerName).curLeft > fromLeft){eval(layerName).curLeft = eval(layerName).curLeft - paceLeft}
if(ie){document.all[layerName].style.left = eval(layerName).curLeft}
if(ns){document[layerName].left = eval(layerName).curLeft}
if (ns6) { document . getElementById(layerName) . style . left = eval(layerName) . curLeft; }
}
if(eval(layerName).curTop != fromTop){
if((Math.max(eval(layerName).curTop, fromTop) - Math.min(eval(layerName).curTop, fromTop)) < paceTop){eval(layerName).curTop = fromTop}
else if(eval(layerName).curTop < fromTop){eval(layerName).curTop = eval(layerName).curTop + paceTop}
else if(eval(layerName).curTop > fromTop){eval(layerName).curTop = eval(layerName).curTop - paceTop}
if(ie){document.all[layerName].style.top = eval(layerName).curTop}
if(ns){document[layerName].top = eval(layerName).curTop}
if (ns6) { document . getElementById(layerName) . style . top = eval(layerName) . curTop; }
}
eval(layerName).timer=setTimeout('moveAlong("'+layerName+'",'+paceLeft+','+paceTop+','+fromLeft+','+fromTop+')',30)
}
function setPace(layerName, fromLeft, fromTop, motionSpeed){
eval(layerName).gapLeft = (Math.max(eval(layerName).curLeft, fromLeft) - Math.min(eval(layerName).curLeft, fromLeft))/motionSpeed
eval(layerName).gapTop = (Math.max(eval(layerName).curTop, fromTop) - Math.min(eval(layerName).curTop, fromTop))/motionSpeed
moveAlong(layerName, eval(layerName).gapLeft, eval(layerName).gapTop, fromLeft, fromTop)
}
var expandState = 0
function expand(){
if(expandState == 0){
setPace("master", 40, 10, 10);
if(ie){document.menutop.src = "images/menub.gif"};
if (ns6) { document . getElementById("img_menu") . innerHTML = "<img src=\"images/menub.gif\" border=\"0\" width=\"18\" height=\"70\">"; }
expandState = 1;}
else{
setPace("master", -150, 10, 10);
if(ie){document.menutop.src = "images/menu.gif"};
if (ns6) { document . getElementById("img_menu") . innerHTML = "<img src=\"images/menu.gif\" border=\"0\" width=\"18\" height=\"70\">";}
expandState = 0;}
}
//-->
</script>
<div id="master">
<div id="menu">
<table border="0" width="18" cellspacing="0" cellpadding="0">
<tr><td width="100%"><a href="javascript:expand()" onfocus="this.blur()">
<div id="img_menu"><img name="menutop" border="0" src="images/menu.gif" width="18" height="70"></div></a></td></tr>
</table>
</div>
<div id="top">
<table border="0" width="150" cellspacing="0" cellpadding="0">
<tr><td width="100%"><img border="0" src="images/top.gif" width="150" height="6"></td></tr>
</table>
</div>
<div id="screen">
<table style="border: 1 solid #c0c0c0" width="180" height="365" cellspacing="0" cellpadding="6">
<tr><td width="100%" bgcolor="#E8E8E8">
<table border="0" width="100%" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0">
<tr><td width="100%">
<table border="0" width="100%" cellspacing="1" cellpadding="5">
<tr><td width="100%" bgcolor="#FFFFFF">
<font class="NavJump"><br></font><font class="NavJump"><br></font><font class="NavJump"><br></font><font class="NavJump"><br></font><font class="NavJump"><br></font><font class="NavJump"><br></font><font class="NavJump"><br></font><font class="NavJump"><br></font>
</td></tr>
</table>
</td></tr>
</table>
</td></tr>
</table>
</div>
<div id=screenlinks>
<table border=0 cellpadding=6 cellspacing=0 width=180>
<tbody>
<tr>
<td style="FILTER: alpha(opacity=100)" width="100%">
<table border=0 cellpadding=0 cellspacing=0 width="100%">
<tbody>
<tr>
<td width="145%">
<script src="fade.js" language="Javascript"></script>
<table width="100%" cellpadding="2" cellspacing="1" border="0" class="forumline">
<tr>
<td class="catHead" height="25" align="left">
<span class="genmed"><b><center>Menu</center></b></span>
</td>
</tr>
<tr>
<td class="row1" align="left">
<li><a style="font-size: 11px; color: #000000; text-decoration: none" class="fade" href="{U_INDEX_PORTAL}">{L_INDEX_PORTAL}</a>
<li><a style="color: #000000; text-decoration: none; font-weight: bold; font-size: 11px; color: #ff0000" class="fade" href="index.php">Forum</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="shoutbox.php">Shoutbox</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_ALBUM}">{L_ALBUM}</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_DOWNLOADS}">{L_DOWNLOADS}</a>
</td>
</tr>
<tr>
<td class="row2" align="left">
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_SEARCH}">{L_SEARCH}</a>
</td>
</tr>
<tr>
<td class="row1" align="left">
<center>
{MY_AVATAR_IMG}
</center>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_PROFILE}">{L_PROFILE}</a>
<!-- BEGIN switch_user_logged_in -->
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</a>
<!-- BEGIN switch_report_list -->
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{switch_report_list.U_REPORT_LIST}">{switch_report_list.L_REPORT_LIST}</a>
<!-- END switch_report_list -->
<!-- END switch_user_logged_in -->
</td>
</tr>
</tr>
<tr>
<td class="row2" align="left">
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_MEMBERLIST}">{L_MEMBERLIST}</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_GROUP_CP}">{L_USERGROUPS}</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_STAT}">{L_STATISTICS}</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="staff.php">Administracja forum</a>
</td>
</tr>
<tr>
<td class="row1" align="left">
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="regulamin.php">Regulamin</a>
<li><a style="color: #000000; text-decoration: none; font-size: 11px" class="fade" href="{U_FAQ}">{L_FAQ}</a>
</td>
</tr>
</table>
<br />
</td></tr>
</table>
</td></tr>
</table>
</div>
</div>
<script language = "javascript">
<!--
if(ie||ns6){var sidemenu = document.all.master;}
if(ns){var sidemenu = document.master;}
function FixY(){
if(ie||ns6){sidemenu.style.top = document.body.scrollTop+10}
if(ns){sidemenu.top = window.pageYOffset+10}
}
setInterval("FixY()",100);
//-->
</script>
|
Dla tych co pozmieniali sobie skrypcik dla indywidualnych potrzeb podaję tylko co trzeba dodać, aby to zadziałało pod FF
1. nowa zmienna (detekcja FF)
| Kod: | | var ns6 = document.getElementById && !document.all ? 1 : 0 |
2. zmiany w funkcji moveAlong() obsługujące warstwe w FF (animacja menu)
| Kod: | function moveAlong(layerName, paceLeft, paceTop, fromLeft, fromTop){
clearTimeout(eval(layerName).timer)
if(eval(layerName).curLeft != fromLeft){
if((Math.max(eval(layerName).curLeft, fromLeft) - Math.min(eval(layerName).curLeft, fromLeft)) < paceLeft){eval(layerName).curLeft = fromLeft}
else if(eval(layerName).curLeft < fromLeft){eval(layerName).curLeft = eval(layerName).curLeft + paceLeft}
else if(eval(layerName).curLeft > fromLeft){eval(layerName).curLeft = eval(layerName).curLeft - paceLeft}
if(ie){document.all[layerName].style.left = eval(layerName).curLeft}
if(ns){document[layerName].left = eval(layerName).curLeft}
if (ns6) { document . getElementById(layerName) . style . left = eval(layerName) . curLeft; }
}
if(eval(layerName).curTop != fromTop){
if((Math.max(eval(layerName).curTop, fromTop) - Math.min(eval(layerName).curTop, fromTop)) < paceTop){eval(layerName).curTop = fromTop}
else if(eval(layerName).curTop < fromTop){eval(layerName).curTop = eval(layerName).curTop + paceTop}
else if(eval(layerName).curTop > fromTop){eval(layerName).curTop = eval(layerName).curTop - paceTop}
if(ie){document.all[layerName].style.top = eval(layerName).curTop}
if(ns){document[layerName].top = eval(layerName).curTop}
if (ns6) { document . getElementById(layerName) . style . top = eval(layerName) . curTop; }
}
eval(layerName).timer=setTimeout('moveAlong("'+layerName+'",'+paceLeft+','+paceTop+','+fromLeft+','+fromTop+')',30)
} |
3. Zmiany w funkcji expand() dla FF ( zmiana obrazka menu przy schowanym i rozwiniętym )
| Kod: | function expand(){
if(expandState == 0){
setPace("master", 40, 10, 10);
if(ie){document.menutop.src = "images/menub.gif"};
if (ns6) { document . getElementById("img_menu") . innerHTML = "<img src=\"images/menub.gif\" border=\"0\" width=\"18\" height=\"70\">"; }
expandState = 1;}
else{
setPace("master", -150, 10, 10);
if(ie){document.menutop.src = "images/menu.gif"};
if (ns6) { document . getElementById("img_menu") . innerHTML = "<img src=\"images/menu.gif\" border=\"0\" width=\"18\" height=\"70\">";}
expandState = 0;}
} |
4. Nadanie obrazkowi menu ID (potrzebne do odwołania w FF getElementByID)
| Kod: | <div id="img_menu"><img name="menutop" border="0" src="images/menu.gif" width="18" height="70"></div></a></td></tr>
|
5. obsługa wartwy master dla FF (latające menu wraz ze skrolowaniem strony)
| Kod: | <script language = "javascript">
<!--
if(ie||ns6){var sidemenu = document.all.master;}
if(ns){var sidemenu = document.master;}
function FixY(){
if(ie||ns6){sidemenu.style.top = document.body.scrollTop+10}
if(ns){sidemenu.top = window.pageYOffset+10}
} |
Powodzenia !
P.S. nasedo proszony o zaktualizowanie plików dla obsługi FF1+
yasiu - 12-12-2005, 00:00
Przetestowane na naszym forum i działą więc możecie zamieniać. POZDRAWIAMY razem z Alferx-em
forumvm - 18-01-2006, 22:30
zrobiłem wg wyzszego opisu pod FF ale rozjechał mi się flash na forum dołanczam screny nizej:
a powinno być:
da się coś z tym zrobić czy poprostu moj styl nie pozwala?
aliando - 25-03-2006, 14:37
zainstalowałem tego moda w 1.12.5 w stylu cleanFX i niby wszystko jest super ale przy małych rodzielczościach ekranu menu chowa sie za banerem zrobionym we flashu i za jumpboxami
tak to wygląda: forum
wiem ze to jest dział z modyfikacjami do 1.9.5 ale skoro wersja forum nie ma znaczenia w przypadku tego moda to nie ma sensu zakładać nowego tematu
jak wysunąć menu na wierzch? jestem slaby z php dlatego prosze o pomoc
alferx - 26-06-2006, 21:17
| forumvm napisał/a: | | zrobiłem wg wyzszego opisu pod FF ale rozjechał mi się flash na forum |
| aliando napisał/a: | | menu chowa sie za banerem zrobionym we flashu |
Jeżeli ktoś używa warstw i flasha powinien w parametrach flasha dodać parametr transparent przykładowo :
| Kod: |
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="xxx" HEIGHT="yyy" id="relog" ALIGN="">
<PARAM NAME=movie VALUE="flash.swf">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=BGCOLOR VALUE=#000000>
<param NAME="wmode" value="transparent">
<param NAME="menu" value="false">
<EMBED SRC="flash/skoda3.swf" quality=high BGCOLOR=#FFFFFF WIDTH="xxx" HEIGHT="yyy" wmode="transparent" ALIGN="" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer" menu="false">
</EMBED>
</OBJECT>
|
czyli dopisać :
| Kod: | | <param NAME="wmode" value="transparent"> |
oraz w sekcji EMBED
Powinno pomóc.
----
I jeszcze jedna rzecz, przesuniecie w prawo o 150px 
przyczyna jest CSS
| Kod: | <style type="text/css">
<!--
#master {position:absolute; width: 200px; top: 10px; left: -150px; z-index:2; visibility:visible;}
#menu {position:absolute; width: 18px; top: 6px; left: 150px; z-index:5; visibility:visible;}
#top {position:absolute; width: 150px; top: 0px; left: 0px; z-index:5; visibility:visible;}
#screen {position:absolute; width: 150px; top: 6px; left: -30px; z-index:5; visibility:visible;}
#screenlinks {position:absolute; width: 180px; top: 6px; left: -30px; z-index:5; visibility:visible;}
-->
</style> |
Prawdopodobnie nazwa #menu jest używana w CSS menu flasha.
Aby się nazwy nie pokrywały w menu bocznym należy zmienić nazway z #menu na np #menu2 (oczywiście w koczie tez trzeba zmienić class="menu" na class="menu2"
|
|
|
