PDA

View Full Version : Menu problem



kimikai
04-17-2012, 09:02 AM
Last problem that i faced on my website:

I made a menu, Dropdown, with java and CSS
Now im putting in all the links that are needed with a normal <a href> and target to my iframe named content.
It wont link tho...
and i have no idea how this is possible.


<ul id="accordion">
<li>
<a href="home.html" target="content" class="item Home" rel="Home"></a>
</li>
<li>
<a href="aboutus.html" target="content" class="item Overons" rel="Overons"></a>
</li>
<li>
<a href="reuen.html" target="content"class="item Honden" rel="Honden"></a>
<ul>
<li><a href="reuen.html" target="content" class="item Reuen" rel="Reuen"></a></li>
<li><a href="#" class="item Teven" rel="Teven"></a></li>
<li><a href="#" class="item InMemoriam" rel="InMemoriam"></a></li>
</ul>
</li>
<li>
<a href="#" class="item Puppies" rel="Puppies"></a>
<ul>
<li><a href="#" class="item Beschikbaar" rel="Beschikbaar"></a></li>
<li><a href="#" class="item Verwacht" rel="Verwacht"></a></li>
<li><a href="#" class="item VorigeNesten" rel="VorigeNesten"></a></li>
</ul>
</li>
<li>
<a href="#" class="item Shows" rel="Shows"></a>
<ul>
<li><a href="#" class="item Twaalf" rel="item Twaalf"></a></li>
<li><a href="#" class="item Elf" rel="item Elf"></a></li>
<li><a href="#" class="item Tien" rel="item Elf"></a></li>
<li><a href="#" class="item VorigeJaren" rel="item VorigeJaren"></a></li>
<li><a href="#" class="item Handling" rel="item Handling"></a></li>
</ul>
</li>
<li>
<a href="#" class="item Fotos" rel="Fotos"></a>
</li>
<li>
<a href="#" class="item Links" rel="Links"></a>
<ul>
<li><a href="#" class="item LhasaApso" rel="LhasaApso"></a></li>
<li><a href="#" class="ShihTzu" rel="ShihTzu"></a></li>
<li><a href="#" class="OverigeRassen" rel="OverigeRassen"></a></li>
<li><a href="#" class="Clubs" rel="Clubs"></a></li>
<li><a href="#" class="OverigeLinks" rel="OverigeLinks"></a></li>
</ul>
</li>
<li>
<a href="#" class="item Contact" rel="Contact"></a>
<ul>
<li><a href="#" class="item Gastenboek" rel="Gastenboek"></a></li>
</ul>
</li>
</ul>

Thats the coding, i havent put links in all of em yet because i already found out it wasnt linkin after making the first few.
Anyone knows what went wrong here??
Ive tried alittle more and figured that when i change class="item home" into class="home" it does work. Same goes for the ones with submenus, although when i change class for example from: class="item Honden" to class="Honden" the dropdown function isnt there anymore.
So basically when i keep the item part i will have the dropdown part but no link, and when i dont keep the item part, i will have the link but no dropdown part.
How am i gonna make it that both work

itivae
04-17-2012, 03:36 PM
Hi What does your Javascript look like? Got a live link?

kimikai
04-18-2012, 05:44 AM
I dont have an online version of it,, tho i did find the site i used as an example,, im not good with javascript so i kinda used an existing one. I DID NOT edit anything in the javascript, only the CSS to change the buttons to the style of my website, and ofcourse edited the HTML part.

This is the link

http://www.queness.com/post/741/a-simple-and-beautiful-jquery-accordion-tutorial

also i added 2 external jquery files: jquery-1.3.1.min.js and jquery.easing.1.3.js

I hope this will help, else ill try to get the page online so you can see =) but this would be alittle easier hehe

kimikai
04-21-2012, 11:44 PM
any1 has an idea how to fix this??

itivae
04-22-2012, 02:00 AM
When you use two names in the class you are calling two different class styles to the element. Some are probably conflicting. I would start there and see if you can get your results by either getting rid of one of the class names in the element or including the needed styling inside another parent element. You might try
class="item"
include this class item in each of your list elements (li)

and
class="theothernameofyourstyle" . Like I said its hard to tell without looking at it.

kimikai
04-22-2012, 12:46 PM
When you use two names in the class you are calling two different class styles to the element. Some are probably conflicting. I would start there and see if you can get your results by either getting rid of one of the class names in the element or including the needed styling inside another parent element. You might try
class="item"
include this class item in each of your list elements (li)

and
class="theothernameofyourstyle" . Like I said its hard to tell without looking at it.

Been looking around alill in the class stuff,, but i cant really find any problems in it (might be cuz im a noob too haha) but ye ive uploaded the website to here http://testhimalaya.site11.com. To get to the part where you can see the menu u gotta click on the dutch flag. Ehmm...i hope you can see the things you need to see then ^^

Thanks for the help so far

itivae
04-24-2012, 12:54 AM
Ill try to help you work in the right direction. I see this in the javascript console that when your page loads your scripts are aimed at your c:\ put them on the server and call them.
also in menu.html on line 11 $ is not defined.

Here is the error report

Resource interpreted as Script but transferred with MIME type text/html: "http://stats.hosting24.com/count.php".

Not allowed to load local resource: file:///C:/Documents%20and%20Settings/A.%20Nabben/Bureaublad/query%20accordion/js/jquery-1.3.1.min.js

Not allowed to load local resource: file:///C:/Documents%20and%20Settings/A.%20Nabben/Bureaublad/query%20accordion/js/jquery.easing.1.3.js

menu.html: 11Uncaught ReferenceError: $ is not defined

home.html: 122Resource interpreted as Script but transferred with MIME type text/html: "http://stats.hosting24.com/count.php".

kimikai
04-24-2012, 02:48 PM
ehmmm...so i gotta load those 2 files to the server or...?? im really not familiar with javascript :eek:
honestly i thought i had uploaded both js files to the server since they were in the same folder as all the other files of my website.

I really dun get it there for a sec srry kinda a nuub >.<

itivae
04-25-2012, 05:26 PM
This is the head source from your test site.


<head>
<link rel=StyleSheet href="style.css" type="text/css"/>
<script type="text/javascript" src="file:///C|/Documents and Settings/A. Nabben/Bureaublad/query accordion/js/jquery-1.3.1.min.js"/>
<script type="text/javascript" src="file:///C|/Documents and Settings/A. Nabben/Bureaublad/query accordion/js/jquery.easing.1.3.js"/>
</head>

make it look like this


<head>
<link rel=StyleSheet href="style.css" type="text/css"/>
<script type="text/javascript" src="http://thelocationof/js/jquery-1.3.1.min.js"></script> //this can be a relative path too
<script type="text/javascript" src="http://thelocationof/js/jquery.easing.1.3.js"></script> //this can be a relative path too
</head>

See if that helps.

kimikai
04-27-2012, 10:40 PM
so basically i should search for the website that has the 2 codings and link it to that??

itivae
04-28-2012, 12:39 AM
No. Just make an absolute links to your script files. Or make a relative link to them as they sit from the page that is trying to access them.
i.e.


<script type="text/javascript" src="http://www.mydomain/address/by/folder/js/myscript.js"></script>
or

<script type="text/javascript" src="thepathtomyjsfolderfromthispageignorethisifitisinthesamefolder/js/myscript.js"></script>

Hope that helps.

kimikai
04-28-2012, 11:09 AM
@itivae: thanks for the help with the javascript path problem,, ive fixed that now =D

Also I've been running around in the coding alittle... and ive figured as much that the problem is in the javascript part,, which i obviously dont like because i cant really read javascript.
So I moved my last question to the javascript section ^^

josheratkins
05-18-2012, 09:54 PM
This explains everything. Just trying some simple codes in my laptop.
Cheers to y'all.

ApacheTech
05-21-2012, 09:37 AM
With JQuery, you might want to simply let Google host your resource files. Saves a bit of bandwith.

http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.js

Check out https://developers.google.com/speed/libraries/ for more information