Solved

make menu work in chrome url go through to page

Posted on 2014-01-11
9
280 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
Report: Liquid Web beats Amazon, Rackspace & More

A study by performance analyst firm Cloud Spectator finds that Liquid Web beats rivals Amazon, Rackspace and DigitalOcean when it comes to website and cloud application performance.

 
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
 
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

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

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

Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. 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.: (CODE)

739 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