What is the best way or an easy way to create a javascript menu. When I say best, I mean there are many softwares that help in creating menus, for eg. Sothink DHTML menu. Isnt there a menu control available in javascript?
There is no reason to buy or even just install a program solely for the purpose of constructing a JavaScript menu.
First of all, the menu itself should not contain any JavaScript code. It should just be a nested list. You shouldn't need a program to write that code for you. If you do, then you're probably using a WYSIWYG editor anyways, and any WYSIWYG HTML editor will create an unordered list for you.
Once you've created the menu structure, you just need to add the display style and behavior to make it look/behave like a dropdown or flyout menu. This can be done either in pure CSS or with CSS + JavaScript. Some people prefer to use JavaScript to turn a regular list into a dropdown/flyout menu because they think using display: none is bad for SEO, and if you style items like that to begin with, then people without JavaScript will not be able to see the hidden menu items. However, there are ways around both of those problems using pure CSS.
If you're using jQuery, then there are a number of jQuery plugins that let you create your menus with just 1-2 lines of code. Otherwise, there are standalone scripts and that can do the same.
https://stackoverflow.com/questions/4177888/what-is-the-best-way-to-create-javascript-menu-closed
You just asked this question a couple of minutes ago?
Here is JQuery cool menus that you can reference.Anyway Javascript is client side script language.There is no control at all.
Related
I was practicing some jQuery when I found this tutorial. It does the exact same thing as I was trying with JavaScript but uses pure CSS3. I figure it is best to learn what's right then to have to relearn, so that is why I am asking if there is a benefit of one to another or is it just preference?
The CSS solution may be easier and will probably be more efficient, but it produces a much more basic solution.
For example, with the pure CSS solution, as soon as you move the mouse outside of an item, it loses focus and closes. This can be annoying for users if the menu has many levels or the items are small enough that the mouse may accidentally stray outside.
Using javascript, it is possible to keep menu items open even if the mouse moves outside. It also allows for more customization of options like animations and delays. There are plenty of jQuery plugins that make dropdown menus easy.
Always use CSS when given the opportunity except in cases where you need to use logic/arithmetic.
A similar question was asked here: Responsive design method for collapsing a div
JavaScript is more dynamic than CSS. But how is JavaScript more dynamic than CSS? How does JavaScript coding work in a better way than CSS?
It's two different things. CSS is a stylesheet language while JavaScript is a programming language. It's really like comparing apples and oranges. (Actually, the distinction isn't all that obvious on a technical level, as apparently CSS is even Turing complete, but as most people practically use the term "programming language", they're different.)
But I guess you can argue that JavaScript is more dynamic, in that it is a programming language that can dynamically change both the content and the presentation of your page. You can actually add and remove CSS rules dynamically, in run-time, with JavaScript. You can also alter the attributes of the DOM elements in your page, like classes, IDs etc.
Yeah, CSS is not as dynamic as JavaScript, and the new dynamic selectors do not work in older browers. Then again people won't upgrade if nothing breaks, so go with a pure CSS solution =)
Toggleable menus done with pure CSS usually uses the :selected dynamic selector and styles it with some visible menu element to have it only visible when a hidden checkbox is checked.
While JavaScript can be more flexible because it's a programming language, CSS can perform better because it's built in to the browser. JavaScript can emulate many of the same CSS properties, but CSS will have better performance. It can do things like animation smoother for example.
Many times people will write JavaScript code that sets CSS properties to let CSS do the rendering for that reason.
JavaScript not only stops at making cool design, it does a lot of other things directly to HTML and CSS will only help you with page design things and CSS can't replace your website's action maker, Javascript. I mean... imagine a CSS drop-down menu, haha.
Good question though.
There's significant overlap between their capacities.
Pure CSS3 can be used to build an attractive and responsive menu bar with drop-downs. And you can do the same in pure Javascript. But you may find that HTML+CSS is more expressive in creating layout+style.
Javascript will come in handy when you have to dynamically generate content on the client side (e.g. editor and simulators that run in-browser). You then may find it easier to do (practically) everything in Javascript.
I'm a beginner WWW-developer and I'm wondering whether the dropdown menus should be written in CSS or JavaScript. What are the pros and cons between two techniques?
You'll need to use CSS for the styling. That is what it is for.
When it comes to the logic of when to show and hide them, then you need JavaScript unless you want:
The menus to be inaccessible to focused based navigation
Keyboard
Breath switch
etc
The menus to require precision mouse control
e.g. if you have a shaky hand (e.g. from arthritis) and you slip outside the edge of the menu, then a :hover based solution will cause it to vanish without giving time to get back inside
Personally, I'd avoid drop down menus for most situations.
I would like to recommend using just CSS as much as you can. As these will eliminate issues such as if someone got JS disabled and any other possible accessibility issues. Since menus are an integral part of you site navigation, it is important these are accessible to all the user segments. You can use this for pure CSS but also there are lots of tutorials online if you google "pure css menus". Also you can see here for jQuery & CSS menu example
They can be written using solely CSS. Check out this Pure CSS hover list.
JavaScript is often disabled by users, as a security measure, and the necessary code for drop-down menus can be quite involved. Also, a pure JavaScript menu is not available for browsers that don't support it, such as text-only browsers. CSS-based menus are always available, even with JavaScript disabled — browsers that don't handle it will just render a list.
With this technique, adding a menu to a page is as easy as creating an unordered list of links, with nested lists for the sub-menus, and including the appropriate style-sheet.
Ok on meebo.com there is instant messages that when you click at the top you can move around i wanna make something like that?
So how do I make Movable forms in JS?
I recommend the jQuery UI plugin called Draggable.
You first need to create your form. Your form will most likely be a div (with solid color or image for the background). Within the div, you have all your form content. The div will also need to be position absolutely (i.e. style="position:absolute")
The JavaScript is fairly straight forward; however, I would personally use something like jQuery to do the work. I'm not sure how familiar with JavaScript you are, but even for an advanced user, using something like jQuery just makes sense. There is a library of tons of already built forms etc with great instructions on how to use them. Let me know if you need more info on how to use a library like jQuery (you can find it here:
http://jquery.com/
You can see all the plugins here:
http://plugins.jquery.com/ (look at 'windows and overlays' - lots of them!)
Click on one that looks interesting, and click on 'demonstration' to see if you like it. For example, the third link down - (mb)ConteinersPlus, a jQuery component for fully customizable and featured container layout (DIV box model) - would let you do this (with almost no work on your end)
http://pupunzi.com/ (this is the example link)
Obviously, if you want to learn how to script it by hand, let me know.
I was looking at what YUI had, http://developer.yahoo.com/yui/examples/button/btn_example07.html
Can anyone recommend a library/plugin they used to progressively enhance native select element dropdowns at the request of a client? I know it's impossible to style a dropdown in IE, so it's either this or Flash which I don't want to get into.
I'll still leave the regular dropdown in the source for non-JS users and serve the dropdown replica built out of non-form control elements.
Assuming you mean a different library than YUI, I like dojo's dijit.form.FilteringSelect.
Turns out it wasn't all that difficult, pretty much the same logic as a dropdown menu except with a little extra for the toggling bit.