Solved

make menu work in chrome url go through to page

Posted on 2014-01-11
9
268 Views
Last Modified: 2014-01-12
Regarding this navigation menu:
http://jsfiddle.net/dXB37/4/

question:

under the <ul> with the id of #dropdown1

There is a <li> <a href> link with the scr:
http://www.thesearchengineoptimisationcompany.co.uk/

how can i make this link go to this url? and not just show the name of the link.

Also the class .current is over the top of the links in google chrome web browser. This makes the links not click-able when you get down to a sub menus. - i have tried changing the z-index and changed the width but this doesn't seem to fix it.

one other thing: how can i make all the links the same width? when i set a width of 200px !important on:
 .gallery a

nothing happens?
0
Comment
Question by:helpchrisplz
  • 5
  • 4
9 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39774095
I'm guessing its possible a layering issue since your code is completely invalid.
You cannot have a <UL> followed by multiple divs and then have the <LI>'s inside nested divs and expect any browser to know what it is supposed to be doing.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39774098
I suggest you have a read here
http://davidwalsh.name/css-transform-rotate
http://www.w3schools.com/css/css3_2dtransforms.asp

Will make your life a whole lot easier.
0
 
LVL 1

Author Comment

by:helpchrisplz
ID: 39774108
hmm its a funny one.  sure.. usings css3 rotates is easy but i would have to manually make each li be a certan degree different from the last one.  the javascript does the calculations automatically even with more or less li tags. if i could dynamically autmate this process using css3 then yes that would work.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39774115
You can still use javascript to calculate the degree then apply the style directly to each element.
The only thing with this is you would have to add all the markup for different browsers or detect the browser and apply the correct prefix.
Or have a set number of transformation css for 3, 4, 5 etc so you can apply the class the LI's and use nth-child to increment the degree.

You can then avoid all the extraneous markup
0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 
LVL 1

Author Comment

by:helpchrisplz
ID: 39774117
please can you help me with this?
0
 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
ID: 39774127
Help with transforms?
Here's a simple example
http://jsfiddle.net/GaryC123/ZN2dH/2/
This will only work in Firefox as I didn't add the declarations for other browsers - if you don't have FF let me know.

It's just a case of figuring out the margins/rotation for each number of menu options you might have - I assume this is limited
0
 
LVL 1

Author Closing Comment

by:helpchrisplz
ID: 39775571
thanks
0
 
LVL 58

Expert Comment

by:Gary
ID: 39775661
Was expecting more along the lines of what do I do now?
0
 
LVL 1

Author Comment

by:helpchrisplz
ID: 39775860
haha.  yes.  it would be helpful if you give me a hand here:
http://experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/Q_28336713.html
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now