iceteea
iceteea

Reputation: 1224

Free CSS Drop-Down Menu Framework

Quick Question:

Anyone knows this? :

http://lwis.net/free-css-drop-down-menu/

It uses javascript for -IE6 only, but with javascript frameworks.

Is it possible to run this without a framework?

Upvotes: 0

Views: 784

Answers (2)

uɥƃnɐʌuop
uɥƃnɐʌuop

Reputation: 15083

It could be used without a js library, but not out of the box. You'd have to write the js yourself. All you need is basically "on hover, set the style to display the dropdowns", and "on mouseout, set the stlye to hide the dropdowns." The key for that is the attachEvent function (for IE only, so if you decide you need other browsers, you'll need a modify the code here). It's better to stick it in a function so it's easier to work with:

function observe(target, eventType, func, useCapture) {
    target = (typeof target=="string") ? document.getElementById(target) : target;
    useCapture = useCapture || false;

    target.attachEvent("on"+eventType, function(event) {func(event, target)});
}

You could then use that function to wait for page load, then set up the callbacks for the hover and mouseout:

observe(window, "load", function() {
    observe("button1", "mouseover", function() {
        document.getElementById("dropdown1").style.display = "block";
    });
    observe("button1", "mouseout", function() {
        document.getElementById("dropdown1").style.display = "none";
    });
});

This is of course a very simplistic example, only using id's to grab your menu buttons and dropdowns, but it gives you an idea how to get it started.

Upvotes: 1

david
david

Reputation: 4278

It dosn't need a javascript frameworks its css based, it dosnt even need javascript enabled for it to work

n.parentNode.firstChild.nextSibling.firstChild.nextSibling.style.visibility = "visible"

Upvotes: 1

Related Questions