Problem with jQuery and CSS

[kukula]

Hi there,

during developing website for my father's company ( website ) I find out that I have problem with personalization of different lists.
In this case I wanted to make a floating menu like thise one here: Floating Menu (this page is from this Tutorial)

At the pages above foating menu looks fine. I have copied all the "floating menu code" to my father's website and have a problem. I can say that nothing is ok. I don't know why CSS is not working correctly. Why the menu is not recognizing CSS attributes?

[Sahil89]

Hi Kukula,
Nice graphics on the site. Personally I dont like that effect which you are wishing to use in ur site. Secondly sites height is short and there is not enough scrolling too. Instead I will suggest you to simly use position:fixed;

Now about ur problem

when I opened ur source and clicked on these two source files

<script language="javascript" src="jquery_mini.js"></script>
<script language="javascript" src="jquery.dimensions.js"></script>

I didnt find these files there. So for now I can say this is the only problem.
Try this <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
Here you are directly referencing on google(Reccomended by developers).

[kukula]

Hi roc.ky89

Thanks for reply.
The idea with navigation on the right is not mine. I don't like it too, but this is an idea of my father. His idea was also moving logos at the bottom of the page. bleh!
The navigation menu mainly will be used at this site: SITE

You are right about the .js files. Wrong path. Now it is correct but menu is still not good. I don't know why the menu is not recognizing CSS attributes. :/

[fobos]

Make sure the css' are not conflicting. There has been many times where i have had that happen to me. Did you build the floating menu on your computer?

[Sahil89]

Hi Kukula,
Good news for you, following are the two zip files, one with all content and another with only menu. I hope this will solve your problem :)

[kukula]

fobos, yes I built a floating menu on my computer. I used the files which roc.ky89 attached in his last post.
It is quite strange because when I use DESIGN mode in Dreamweaver menu looks fine , but when I want to see in on Chrome or Firefox it is not working well.

[kukula]

fobos: Make sure the css' are not conflicting

What do you mean about that?
my CSS, about floating menu, looks like this:

#floatMenu {
    position:absolute;
    top:132px;
    left:9px;
    margin-right:235px;
    width:200px;
}
#floatMenu ul {
    margin-bottom:20px;
}
#floatMenu ul li a {
    display:block;
    border:1px solid #999;
    background-color:#222;
    border-left:6px solid #999;
    text-decoration:none;
    color:#ccc;
    padding:5px 5px 5px 25px;
}

#floatMenu ul.menu1 li a:hover {
    border-color:#09f;
}
#floatMenu ul.menu2 li a:hover {
    border-color:#9f0;
}
#floatMenu ul.menu3 li a:hover {
    border-color:#f09;
}

So floating menu has another id. It cannot be conflicted, right?

[kukula]

Ok. I don't know what is wrong. Meanwhile I found some other navigation panel which suits me. I would like to have smoething like here on the left (dotted line).

Would you please describe me how it works. It is about hover attribute? It should be linked to div or to the single element like text, img and so on?

[kukula]

OK, i fixed the problem. It was missing of "}" in CSS file :-/ now it is working fine :) thanks a lot.

[fobos]

Mark solved please!