Earlier quoted context omitted.
I'm not a webdev, but the code says: /* * rotate each slice at the right angle = (A/2)° + (k - (n+1)/2)*A° * where A is the angle of 1 slice (30° in this case) * k is the number of the slice (in {1,2,3,4,5} here) * and n is the number of slices (5 in this case) * formula works for odd number of slices (n odd) * for even number of slices (n even) the rotation angle is (k - n/2)*A° * * after rotating, skew on Y by 90°-…
...so SASS?
Creating a Radial Menu in CSS
51–60 of 80 posts
Re: Creating a Radial Menu in CSS
#52This is also known as a radial menu, and has some great properties that make it better (faster) than a normal context menu. You should be able to select an item from the menu in a single fast (distance insensitive) mouse gesture. Click down on the star, drag in the direction of an option, and release the mouse to select it. This way you can choose an option without having to stop after a certain distance of dragging,…
I think you'd find a majority of users would be confused by this, as cool as it sounds, the first time around. I cannot think of a single instance of a popular web application that uses a click and hold mechanic of any kind (not to be confused with dragging and dropping). People are used to clicking, not holding, meaning they might never see the required secondary action of moving the mouse over a new button. You cou…
Re: Creating a Radial Menu in CSS
#53It's smoother and more responsive than the jQuery plugin mentioned in this thread.
And, of course, the site above has the incomparable PieDock for Linux/BSD.
Re: Creating a Radial Menu in CSS
#54Re: Creating a Radial Menu in CSS
#55Earlier quoted context omitted.
The reason of the post is not the circular menu itself but the fact that it's entirely made in CSS. I think this is really impressive.
I'm genuinely curious: why is that exciting? I don't know a huge amount about the web stack.
Re: Creating a Radial Menu in CSS
#56Very impressive how close the answerer gets to the questioners mock up. Good job that man! And yet, I bet the designer will still come back and say the curve isn't right, or the bar isn't think enough. I think that's some impressive CSS.
Interestingly, 'that man' is apparently a woman: http://stackoverflow.com/users/1397351/ana
Didn't think to check. Doesn't make any difference to me, man or women. It's good work.
No offence intended.
Re: Creating a Radial Menu in CSS
#57Very impressive how close the answerer gets to the questioners mock up. Good job that man! And yet, I bet the designer will still come back and say the curve isn't right, or the bar isn't think enough. I think that's some impressive CSS.
Why so much negativity? This post is months old—the designer never came back and complained, the answerer is a woman, not a man. :)
More of a joke at the expense of designers that like everything pixel perfect.
Re: Creating a Radial Menu in CSS
#58I remember an article in Dr. Dobbs hailing pie menus as the future of user interfaces. It was the early 90's. I have always thought they were a great idea. Currently Microsoft Office One Note uses them. Here's a list of references for pie menus (the Dr. Dobbs article is cited): http://www.cs.cornell.edu/boom/2001sp/bronevetsky/Circle%20M... In fairness to Dr. Dobbs, they also hailed hypertext as the future about that…
1993's Secret of Mana was well known for its ring menu. I don't think radial menus are practical with mice, they fit controllers and console games better (where interacting with menus is slower).
Re: Creating a Radial Menu in CSS
#59Re: Creating a Radial Menu in CSS
#60This is also known as a radial menu, and has some great properties that make it better (faster) than a normal context menu. You should be able to select an item from the menu in a single fast (distance insensitive) mouse gesture. Click down on the star, drag in the direction of an option, and release the mouse to select it. This way you can choose an option without having to stop after a certain distance of dragging,…
I think you'd find a majority of users would be confused by this, as cool as it sounds, the first time around. I cannot think of a single instance of a popular web application that uses a click and hold mechanic of any kind (not to be confused with dragging and dropping). People are used to clicking, not holding, meaning they might never see the required secondary action of moving the mouse over a new button. You cou…
I've seen a friend of mine working on a detail model 7 years ago and he wasn't even thinking what he was doing. Just naturally drawing the path to the option he wanted (and god, the maya marking menu is damn full of options and context sensitive even) and boom, job done.
The ux for a Radial Menu (or also called a Pie Menu) is incredibly intuitive and allows for beginner and power user usage.