PDA

View Full Version : AnyLink Drop Down Menu: Dynamic width? How?



Monaco Franze
04-16-2006, 03:46 PM
Hi, i use the anylink dropdown menu in my phpBB2 board.
http://www.dynamicdrive.com/dynamicindex1/dropmenuindex.htm

cause i fill the menu width dynamic content "text text text {USERNAME} text text" it is neccessary that the menu has a big width, cause not every user has a short nickname, and i want no break in the textline. but when a user has a short nickname it looks a little bit stupid, when there is such a big space between the last letter and the right border of the menu!

it is possible not to set the width in a static way, but that the menu has THAT width, how long the individual textline is?!

or in other words: the menu simple is not allowed to break the textline, and the thing width the width is completely ignored!?

is this possible to make?




<script type="text/javascript">

/***********************************************
* AnyLink Drop Down Menu- Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

//Contents for menu 2, and so on
<!-- BEGIN postrow -->
var menu{postrow.VB_MENU_ID}=new Array()
menu{postrow.VB_MENU_ID}[0]='<a>{postrow.POSTER_NAME}</a>'
menu{postrow.VB_MENU_ID}[1]='{postrow.VB_MENU_PROFILE}'
menu{postrow.VB_MENU_ID}[2]='{postrow.VB_MENU_PM}'
menu{postrow.VB_MENU_ID}[3]='{postrow.VB_MENU_SEARCH}'
menu{postrow.VB_MENU_ID}[4]='{postrow.VB_MENU_EMAIL}'
menu{postrow.VB_MENU_ID}[5]='{postrow.VB_MENU_WWW}'
menu{postrow.VB_MENU_ID}[6]='{postrow.VB_MENU_ALBUM}'
<!-- END postrow -->
var menuwidth='180px' //default menu width
var menubgcolor='#f9f9f9' //menu bgcolor
var disappeardelay=99999999999999999999999 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?

/////No further editting needed

var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}


function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top="-500px"
if (menuwidth!=""){
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
}
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}

function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}


function dropdownmenu(obj, e, menucontents, menuwidth){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)

if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}

return clickreturnvalue()
}

function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}

function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}

function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}

function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}

if (hidemenu_onclick=="yes")
document.onclick=hidemenu

</script>

Twey
04-16-2006, 06:01 PM
The script seems to make provisions for a blank menu width. Try that.

jscheuer1
04-16-2006, 07:47 PM
I don't think that will work, try (Note - works as before but for self calculating widths, use 'selfc' as the width param or no width param - not even an empty value in the HTML, see examples at the bottom of the demo. The onmouseout event no longer needs to be assigned. Also - notice that style must be set correctly, as commented in the style section, for #tspan a.):


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>AnyLink Drop Down Menu - w/Self calculating width</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">

#dropmenudiv{
position:absolute;
border:1px solid black;
border-bottom-width: 0;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
}

#dropmenudiv a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
}

#dropmenudiv a:hover{ /*hover background color*/
background-color: yellow;
}

#tspan a { /*required for self caculated widths*/
display:block; /*required*/
text-indent: 3px; /*set to #dropmenudiv a setting*/
padding: 2px; /*set to 1+#dropmenudiv border's width*/
font:bold 12px Verdana; /*set to net style effect for font settings of "#dropmenudiv a" and "#dropmenudiv"*/
}

</style>

<script type="text/javascript">

/***********************************************
* AnyLink Drop Down Menu- Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
* Modified for optional self calculating width by
* jscheuer1 in http://www.dynamicdrive.com/forums
***********************************************/

//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="http://www.javascriptkit.com">JavaScript Kit</a>'
menu1[1]='<a href="http://www.freewarejava.com">Freewarejava.com</a>'
menu1[2]='<a href="http://codingforums.com">Coding Forums</a>'
menu1[3]='<a href="http://www.cssdrive.com">CSS Drive</a>'

//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href="http://cnn.com">CNN</a>'
menu2[1]='<a href="http://msnbc.com">MSNBC</a>'
menu2[2]='<a href="http://news.bbc.co.uk">BBC News</a>'

var menuwidth='165px' //default menu width
var menubgcolor='lightyellow' //menu bgcolor
var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?

/////No further editting needed

var ie4=document.all
var ns6=document.getElementById&&!document.all
var defaultwidth=menuwidth

if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}


function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-500
dropmenuobj.widthobj=dropmenuobj.style
if (typeof menuwidth=='undefined'||menuwidth=='selfc')
dropmenuobj.widthobj.width=tmpspan.offsetWidth+'px'
else if (menuwidth!='')
dropmenuobj.widthobj.width=menuwidth
else
dropmenuobj.widthobj.width=defaultwidth
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}

function populatemenu(what){
if (ie4||ns6){
var appendit=0
if (typeof tmpspan=='undefined'){
tmpspan=document.createElement('span')
appendit=1
}
if(appendit){
tmpspan.style.position="absolute"
tmpspan.style.left="-1000px"
tmpspan.id='tspan'
document.body.appendChild(tmpspan)
}
tmpspan.innerHTML=dropmenuobj.innerHTML=what.join("")
}
}


function dropdownmenu(obj, e, menucontents, menuwidth){
obj.onmouseout=delayhidemenu;
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)

if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}

return clickreturnvalue()
}

function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}

function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}

function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}

function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}

if (hidemenu_onclick=="yes")
document.onclick=hidemenu

</script>
</head>
<body>
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1)">Web Design</a> |

<a href="default2.htm" onClick="return dropdownmenu(this, event, menu2, 'selfc')">News Sites</a> (onclick)
</body>
</html>

Monaco Franze
04-19-2006, 10:54 AM
Awesome!!

Thank you very much jschauer1!

Monaco Franze
04-19-2006, 11:56 AM
... oh, i found one little thing, that's not 100% perfect..


when you are on the view-thread page and do not click on the link, that opens the menu (poster's name), the footer of the page is displayed as it should be.

see here:
[pixx removed]


but when you click on anyone's name, so that the menu opens, the page footer has a white space in it (after the footer of the page) with the height of the menu..

see here:
[pixx removed]

(problem is in firefox AND IE!!)

that's the last thing I'm not happy with.. can somebody please fix this?

jscheuer1
04-19-2006, 01:27 PM
This is probably due to your markup using absolute positioning, which is what I used to make the DOM created width gauge span invisible to the browser. If that is what is happening, setting its display to none after each use would probably solve this problem. Find these lines:


if (typeof menuwidth=='undefined'||menuwidth=='selfc')
dropmenuobj.widthobj.width=tmpspan.offsetWidth+'px'

Change them to:


if (typeof menuwidth=='undefined'||menuwidth=='selfc'){
tmpspan.style.display='inline'
dropmenuobj.widthobj.width=tmpspan.offsetWidth+'px'
tmpspan.style.display='none'
}

Also, add this (red) to populatemenu(what):


function populatemenu(what){
if (ie4||ns6){
var appendit=0
if (typeof tmpspan=='undefined'){
tmpspan=document.createElement('span')
appendit=1
}
if(appendit){
tmpspan.style.position="absolute"
tmpspan.style.left="-1000px"
tmpspan.id='tspan'
document.body.appendChild(tmpspan)
tmpspan.style.display='none'
}
tmpspan.innerHTML=dropmenuobj.innerHTML=what.join("")
}
}

There probably is a better way but, without seeing your markup and exactly how you are using the script, I cannot be sure. This should work in any case, let me know.

Monaco Franze
04-19-2006, 01:41 PM
Flawless thing now!!
Thank you, now it's perfect! ;)

Monaco Franze
04-23-2006, 10:40 PM
I installed some ajax features on my board and on the viewthread page too.
but now the menu works no more, while the ajax works perfect.

the author of the ajax stuff said, i have to ask here, because his stuff works...


okay, the .js-code is this (the last thing you postet above)



<script type="text/javascript">

/***********************************************
* AnyLink Drop Down Menu- Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

//Contents for menu 2, and so on
<!-- BEGIN postrow -->
var menu{postrow.VB_MENU_ID}=new Array()
menu{postrow.VB_MENU_ID}[0]='<a class="vbmh">&nbsp;{postrow.POSTER_NAME}</a>'
menu{postrow.VB_MENU_ID}[1]='{postrow.VB_MENU_PROFILE}'
menu{postrow.VB_MENU_ID}[2]='{postrow.VB_MENU_PM}'
menu{postrow.VB_MENU_ID}[3]='{postrow.VB_MENU_SEARCH}'
menu{postrow.VB_MENU_ID}[4]='{postrow.VB_MENU_EMAIL}'
menu{postrow.VB_MENU_ID}[5]='{postrow.VB_MENU_WWW}'
menu{postrow.VB_MENU_ID}[6]='{postrow.VB_MENU_ALBUM}'
<!-- END postrow -->
var menuwidth='selfc' //default menu width
var menubgcolor='#f9f9f9' //menu bgcolor
var disappeardelay=99999999999999999999999 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?

/////No further editting needed

var ie4=document.all
var ns6=document.getElementById&&!document.all
var defaultwidth=menuwidth
if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')
function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-500
dropmenuobj.widthobj=dropmenuobj.style
if (typeof menuwidth=='undefined'||menuwidth=='selfc'){
tmpspan.style.display='inline'
dropmenuobj.widthobj.width=tmpspan.offsetWidth+'px'
tmpspan.style.display='none'
}
else if (menuwidth!='')
dropmenuobj.widthobj.width=menuwidth
else
dropmenuobj.widthobj.width=defaultwidth
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}
function populatemenu(what){
if (ie4||ns6){
var appendit=0
if (typeof tmpspan=='undefined'){
tmpspan=document.createElement('span')
appendit=1
}
if(appendit){
tmpspan.style.position="absolute"
tmpspan.style.left="-1000px"
tmpspan.id='tspan'
document.body.appendChild(tmpspan)
tmpspan.style.display='none'
}
tmpspan.innerHTML=dropmenuobj.innerHTML=what.join("")
}
}
function dropdownmenu(obj, e, menucontents, menuwidth){
obj.onmouseout=delayhidemenu;
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)
if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}
return clickreturnvalue()
}
function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}
function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}
function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}
function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}
function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}
if (hidemenu_onclick=="yes")
document.onclick=hidemenu
</script>


css stuff:


#dropmenudiv{
position:absolute;
border:1px solid #CCCCCC;
border-bottom-width: 0;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
}

#dropmenudiv a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid #CCCCCC;
padding: 1px 0;
text-decoration: none;
}

#dropmenudiv a:hover{
background-color: #f3f3f3;
}

#tspan a { /*required for self caculated widths*/
display:block; /*required*/
position:absolute;
text-indent: 3px; /*set to #dropmenudiv a setting*/
padding: 2px; /*set to 1+#dropmenudiv border's width*/
font:bold 12px Verdana; /*set to net style effect for font settings of "#dropmenudiv a" and "#dropmenudiv"*/
}


and the .js files from the ajax mods are these:

http://connect.co.funpic.de/phpBB2/includes/javascript/ajax_core.js

http://connect.co.funpic.de/phpBB2/includes/javascript/ajax_topicfunctions.js

this is how the menu looks like without the two ajax .js-files included:
http://people.freenet.de/zettlzone/weired2.PNG

and this is how the menu now looks like with the two files included. ^^
http://people.freenet.de/zettlzone/weired.PNG


does anyone see what causes the error???

jscheuer1
04-24-2006, 07:38 AM
I'd be inclined to say the same thing that the ajax author said, as the code works without the ajax script. The only two things that jump out at me are that the font style for #tspan a no longer agrees with the net style effect for font settings of "#dropmenudiv a" and "#dropmenudiv", it should be:


font:normal 12px Verdana;

The other thing is that I cannot see what:


{postrow.VB_MENU_PROFILE}

and similar resolve to but, if they are not links and not block level elements, that would throw the whole thing off.

Got a link to the actual page where this is happening?

Monaco Franze
04-24-2006, 12:46 PM
Hi,


i created to new classes in the css for the menu.
here the stuff for the header of the menu (the poster's name)


a.vbmh
{
background-color: #f3f3f3;
color: #6D7B8D;
font-size: 8pt;
font-weight: bold;
}
a.vbmh:hover
{
color: #6D7B8D;
}


and here the stuff for the standart menu links:

.vbm { font-family: Verdana, Tahoma, Arial, "Times New Roman", serif; font-size : 10pt; }


do you see any errors now?? or what causes the error..?! are my self made css classes wrong?

Monaco Franze
04-24-2006, 01:06 PM
>> edit: solved the problem.. in a strange way.
i removed in my css file the two classes and added that what they contain to the class #dropmenudiv{, but this also didn't work.


then i uploaded the copy of my css file with the class in it up again, and .. it worked???!

can somebody explain to me how this is possible?!?!?

jscheuer1
04-24-2006, 01:34 PM
Style sheets, scripts and/or pages will sometimes be cached by the browser. So, even when you change them, the results may not be immediately apparent.