1

I'm quite new to the world of webdesign and are learning alot from trying different things.

So I'm trying to implement the idea of this Dock-When-Scroll solution and the basics works pretty well.

Then I added a html/CSS dropdownmenu (with few relative sub-links) within the absolute/fixed DIV and suddenly I can't click or hover the main buttons anymore. I've tried with different z-index values and combinations, adding absolute & relative positions to the menu itself And to make the menu itself the absolute/fixed element but i'm failing.

I've looked around for answers and scratched my head enough, I'm sure I'm overlooking something, the DIV is covering the menu somehow. Is there a rule with fixed elements that I'm missing?

Any help appreciated

Update 2

So after redoing the position-homework and tested various properties of this premade menu I've noticed there's a bugg with the hover. Is this possible?

Update 3

Okay I think I'll need some sleep, but basically the menu works in the default Static position and stops to work when "fixed" is turned on.

UPDATED SOLVED

Okay thanks for those who thought about the issue!

I succeded to figure out the problem alot easier with the jsfiddler so credit goes to Caramba :)

The code lied with my editing of adamJlev's solution of the clinging menu.

The problem-script:

             var $window = $(window),
           $stickyEl = $('#cssmenu'),
           $stickyEl2 = $('#bannerloggo'),

           elTop = $stickyEl.offset().top;
           elTop = $stickyEl2.offset().top;

           $window.scroll(function() {
            $stickyEl.toggleClass('sticky', $window.scrollTop() > elTop);
            $stickyEl2.toggleClass('sticky2', $window.scrollTop() > elTop);
        });

The fix:

             var $window = $(window),
           $stickyEl = $('#cssmenu'),

           elTop = $stickyEl.offset().top;

           $window.scroll(function() {
            $stickyEl.toggleClass('sticky', $window.scrollTop() > elTop);
        });

That easy.. So I'll read some more about Javascript.

Cheers

Community
  • 1
  • 1
user3101661
  • 23
  • 4
  • please add the code you have so far or even better create a fiddle at http://jsfiddle.net/ and you will get answers! – caramba Dec 15 '13 at 08:55
  • Oh yes, ofcourse! Here's the jsfiddle, great tool by the way! I'm trying to troubleshoot the code myself atm, (http://jsfiddle.net/PMmm6/](fiddle) this fiddle is the menu-core. It doesn't cling in the fiddle for some reason but works in its context, the menu just becomes inusable after the actual clinging. – user3101661 Dec 16 '13 at 02:55

1 Answers1

1

So I'm a newbie with this Stackoverflow-system, bear with me. I updated the question with explanation of the issue and the simple solution.

Nat Ritmeyer
  • 5,634
  • 8
  • 45
  • 58
user3101661
  • 23
  • 4