jQuery UI Right-Click Menu AND General Advice Needed - javascript

So, recently I have been trying to build a user interface form builder that is almost entirely drag and drop. Kind of like Dreamweaver or visual studios I suppose. You guys can see it for yourselves HERE! I am trying to get a right-click menu thing going, however upon getting this working, I realized that it really conflicted with both the draggable and resizable methods. I don't have to right click at all, however when I go to resize or drag, it won't let me stop it. My cursor gets stuck either resizing or dragging, and requires vigorous clicking and shaking to free it. So, I'm assuming that I need a different plugin. Does anybody know of a stress free simple right-click menu that is hopefully compatible with jquery ui? I've tried google but most of them are simply a different version of the one I've already been using.
My second question is much more vague. As I previously mentioned, I'm trying to make a form builder. I'm wondering what the best way to go about this is as I feel sort of lost. My biggest problems right now are figuring out how I'm going to parse everything into code and export it. Does anybody know of anyone else who has attempted this or something similar? Is there any sort of guide?
I know the second questions has potential to be rather annoying, so feel free to only focus on the first one. Any help is appreciated, and I thank everybody who helps me.
EDIT: Just realized that you guys may not know how to use the builder. So far, all you can do is drag panels out onto the building space, and then drag tables within the panels. You can resize the building space, and panels vertically, and you can resize tables both vertically and horizontally. You can move panels and tables within their parent elements. Right click a panel or table for the contextmenu.
EDIT: So I think I found a context menu that will suffice, here it is. So, I guess that only leaves giving me advice on how to go about constructing this form builder.

Related

Menu animation in Meteor

I'm trying to work with Meteor, React and FlowRouter.
I didn't work with animation in Meteor yet and I don't know where to start, but..
I am really impressed by the animation on this site (yeah, I don't only searching there hah :)
When we press to the menu icon then: all the current layout moves to the right and takes the half of the screen. on the left half of the screen me can see simple list menu. all this behavior happens really smoothly.
That is the question.
What technologies to use to make animation effects like that? Or may be you know how exactly to make this effect?? Actually I want to find the way make something like this using Meteor and React.
Very thank you for your answers!
Update
What do you know about Famo.us?

jQuery navigation - external loading (or perhaps it isn't... I'm having trouble figuring it out)

I find my problem a little bit difficult to ask about, because I don't know how to explain it or how to even start searching for an answer. I will try here because I'm really stuck and I know Stack Overflow always helps me find a way to keep going and learning. See if someone can open my eyes.
What I'm looking forward to is to achieve a similar effect as the navigation in uzik's page: (see the grey banner at the bottom? well, that). So, yes, I know how to overlap two divs and just slide one or the other on top using jQuery. In fact, there's this demo that shows how to do that and more beautifully (very interesting link to keep ;) ).
But my problem is something else. Notice that when you click on the slider that will overlap the main content, the url changes. That's what I would like to achieve and I don't know if both divs (main content and overlapping content) are on the same page and the url is being changed using some js; or if the overlapping div is, in fact loaded from an external source.
In my case, I would like to load from an external page. Say, for instance, someurl.com and someurl.com/blog. The aim is, having both preloaded (I guess) to slide one on top of the other.
Is this even possible? I would like to think it is. I can follow js and jQuery instructions more or less, but need some guidance as to where to start off searching info, specifically on the loading content from some other url part.
Any tip is appreciated.
Kind regards, Bea.

jQuery content slider with customisable grid of elements

Does anyone know of a jQuery content slider (not just an image slider) that allows you to specify a grid of elements?
As an example, this is the sort of grid that I'm after:
http://cl.ly/image/0O213C1n2b0s
You can see that it's a 2x2 grid. With the controls, when someone clicks on a 'next' link, it should scroll to show the next 4 elements. I'd like to be able to have multiple instances on a page, each having different grids (I may be 3x2, 2x2, 4x1 on the same page)
Also, as an added caveat, I need this to be responsive.
First question is; does anyone know of a solution that already exists which would fit my requirements? If not, that leads to my second question; would anyone like to help me write such a thing? I'm relatively savvy with javascript (more specifically jQuery if I'm being absolutely honest) but by no means an expert.
I've done a fair amount of googling, but came up short. Hopefully someone is way ahead of me and has already written something along these lines.
What say you, Internet?
Have you seen this:
jQuery grid syle slider

Javascript plugin

i was wondering if anybody knows (and if there is such a thing) a javascript plugin that can do to following:
on the website http://www.worldofmerix.com/ click on any of the menu buttons on top for eg. "about us"; then you see a line appear in the middle and expand so that you can see the entire div...
I need a similar animation effect, flash is out of the question, so i have to use javascript...
i have some ideas on making it with some "smooth div fade in/out" js plugins, but i was wondering if there is a plugin SPECIFIC to the thing i need?
thanks very much in advance for the anwsers!
Ok, since you didn't state any jQuery "dont-wanting" I'd recommend you to check out jQuery. It is a set of JavaScript libraries that help you manage your HTML and CSS with some light code.
You can see HERE, HERE and HERE how it can animate divs and other elements (I see that it is what you need).
You can check out the official web site and there you can find all kinds of examples and documentation that you will ever need. I recommend you to see THIS (click RUN).

My inputs wont let me move the cursor with the keyboard?

This is a wierd one,
both inputs and text areas, cant move through the text with the left and right arrows?
there's lots of javascript/jquery on the page so it's likely a plugin is overriding, but thought i'd see if anyone's ever had a similar experience or got any pointers before i wade through mountains of code!
My issue was the jquery dialog box I was using (fancybox) has a problem with inputs/cursors, not just in my instance.
I'm going to try using http://colorpowered.com/colorbox/ instead and see if it works

Categories

Resources