You are here:

Javascript/Background Position CSS Menu


Hello Kevin. I have this fiddle.
This menu works great in Firefox, with the stripes going up and down, and on hover, the stripes move to the right using the background position plugin. But in webkit browsers, the stripes display as horizontal, and the background doesn't move. I don't know what I am doing wrong. Can you help me out?

Hi Cody,

Thanks for your question. The problem was in the CSS. Every instance of  "-webkit-linear-gradient(90deg..." needed to be changed to:  "-webkit-linear-gradient(180deg..."

Here is a JS Fiddle link with the problem fixed:

The JS fiddle link works for me in FireFox, Chrome and Safari (all on MAC)

Best Wishes,

Kevin Chisholm


All Answers

Ask Experts


Kevin Chisholm


I can answer questions about: JavaScript, Object-Oriented JavaScipt, JSON, AJAX, jQuery, HTML, CSS


I am a Front-End Web Developer living in New York City. I have provided services to titles such as,,,,,, and Being particularly passionate about Object-Oriented JavaScript as well as Web Standards, I spend a fair amount of time writing about / teaching Front-End Web Development techniques. In my free time I enjoy reading about advanced JavaScript, as well as Web Development trends and best practices. My Blog is: JavaScript-specific blog posts can be found here:

NYC Front-end Developers CSS3 / HTML5 The future of front end Front-End Engineers Javascript Syracuse University Alumni Network

Syracuse University - VPA - 1983 - 1987

Past/Present Clients

©2017 All rights reserved.