I'm looking to create a widget system, somewhat like what WordPress has.
Please suggest what script would be the best for this. I've planned to use jQuery UI for this, but would like to listen to other suggestions as well.
Go with Jquery. We've implemented an entire pageflakes-esque drag/droppable widget system on our customizable homepage Faxo Search. We couldn't be more pleased with jquery and jquery UI. We looked at other libraries and decided jquery had the largest potential. It's extremely expressive and the code is tight and efficient. We actually migrated from Prototype.
Scriptaculous has a decent drag and drop implementation. It's based on Prototype which has a pretty good community.
jQuery's does seem to be a bit larger and a more active as of late so you may want to stick with its draggable library.
Related
What is the difference between jQuery and jQuery UI? Are they both different frameworks? Is jQuery library needed to work jquery UI or both works standalone? what is difference between any jQuery tab plugin and jQuery UI Tab? which is better to use?
jQuery is the core library. jQueryUI is built on top of it. If you use jQueryUI, you must also include jQuery.
jQuery Tabs preceded jQueryUI library. jQueryUI Tabs is based on jQuery Tabs. The current version of jQuery Tabs is Tabs 3. If I recall correctly (I vaguely remember looking through the source code about a year ago), Tabs 3 is very similar to what's in jQueryUI. The jQueryUI version, of course, respects the Themeroller themes.
I used jQueryUI in one project. It has some nice features, but there are few widgets and it seems to be advancing at a glacial pace (seems like the same six widgets have been there for over a year). Maybe it'll get a second wind. If I recall, one of the things that bothered me is that in many of the widgets, there was no visible difference between the hover state and the click state.
So I would not recommend jQueryUI at this time for its widgets. You may want it for the effects and the draggable/dropable interactions handling.
The widgets in Google's Closure library and the widgets in ExtJS seem more useful, in my opinion.
Just browse to the jQuery UI site and read:
jQuery UI provides abstractions for
low-level interaction and animation,
advanced effects and high-level,
themeable widgets, built on top of the jQuery JavaScript Library, that you
can use to build highly interactive
web applications.
jQuery UI is built on top of jQuery. It offers cool user interface enhancements.
#2nd question > Use what you like, end-user- and developer-interface-wise.
You'll also discover that you can't live without jQuery. It's a crucial piece to almost any web application. And since it's footprint is so small you can get away with including on most if not all pages.
jQuery UI however is heavier with css and images. It can also be difficult to get the style to work with existing applications. I find myself using jQuery UI components some of the time and jQuery nearly all the time.
I'm switching from using JQM and Phonegap to using Topcaot and a few smaller libraries to take care of transitions and such. One thing I haven't found a micro-library for is the navigation.
While many site I've seen say to create the UI and content dynamically through javascript, it does seem like a daunting task do to the amount of pages I would need to create. Similar to JQM, I want to be able to separate my different pages as different html files that ajax load them into the DOM, but in an optimized way that is fast and doesn't cary the weight of JQM.
TO anyones knowledge does such a library exist or would this be a library I would have to write? It doesn't seem like it would be an overly complicated task, especially if I would use jquery. Any ideas of help is appreciated.
try angularjs. Here there's an example with topcoat: http://coenraets.org/blog/2013/11/sample-mobile-application-with-angularjs/
Angularjs is very different from JQM but you should give it a try.
Otherwise, if you don't like angularjs you can find a more traditional approach at this page: http://coenraets.org/blog/2013/03/hardware-accelerated-page-transitions-for-mobile-web-apps-phonegap-apps/
Hope this helps
Here you are - new plugin based on coenraets css transitional solution: https://github.com/linslin/pagingSlider
Features:
Paging with pagingSlider
default pageSlider actions
Pagebrowser
Totaly plugable like pageSlider
if you want, pagemenu to switch directly to a page
touch events
Consider looking at Topcoat Touch (Github Project), it is basically a micro library for transitions and events (5k minified and gzipped) -- full disclosure, I am the author of Topcoat Touch.
It is a very simple framework that uses Topcoat to create the UI, inspired by jQT and to a lesser extent jQuery Mobile. It can be either a single html document with multiple pages contained within the same document, or using a collection of controllers and templates. It uses a collection of optional libraries to provide most of the functionality for a mobile framework and has a generator for Yeoman to get the scaffolding up quickly.
I haven't used it, but Kendo UI Mobile is similar to JQM and may fit your needs: http://www.kendoui.com/mobile.aspx
I am interested in making a tabbed display on a web page I am working on. I need to apply my own styles, so I would like to find a javascript library that provides very little styling out of the box and makes customization as easy as possible.
Features I would like:
Specify the Image used for the tab.
Tabs can re-size to fix the text inside of them.
Relatively easy to apply my own styles.
I looked at jQuery UI Tabs but it does not seem like it would be too easy to apply my own styles if I don't use their tools to do it.
I also looked at jQuery Tools, which seemed a little easier to customize, but appears to require that you use fixed length images for the tabs.
Can anyone recommend a good js library for creating customized tabbed navigation? Am I just making customization of the two libraries mentioned above harder than it needs to be?
This is a super easy walk-through to create custom tabs using jQuery, I followed it once and haven't used any other tabs since:
Custom jQuery Tabs | Soh Tanaka
I know it can be tempting to often use libraries for something like this, but it is very straightforward and you'll know all about how they work, which will allow you customize them far easier than nearly other plug-ins.
With jQuery-UI you can easily change the styles with css, you do not need any fancy tools ^_^
Sorry. I don't know a good title for this, but please look here:
http://joshblog.net/projects/logic-gate-simulator/Logicly.html
I saw this from delicious over the weekend. It is in flash and I wondered if something like this, as far as the graphics and interaction goes, could be done in javascript (jquery or other library, not rolling my own.)
Again, I do not mean logic gates specifically but more the dragging, dropping and the drawing lines between objects, moving them around, etc.
Does anyone know of a website that has something like this in javascript? It kind of reminds me of dragging and dropping points on google maps but nicer. Thank you.
Looks like someone has recently made a Logic Gate Thing that might interest you, though it doesn't quite have the level of animation that the Flash version has. (Here is an explanation from the author.)
http://javascript.neyric.com/wireit/ and jQuery draggables is what you want.
Too bad the wire-it library is YUI. Would be nice if it were jQuery.
jQuery UI has some effects such as dragging and animations. There are some demos at http://jqueryui.com/demos/
Im sure you could work something similar with jQuery. Checkout the jQuery UI, they have demos of its capabilities.
Mootools can also do this - they have some pretty slick demos on their website.
I already make extensive use of prototype and don't want to add an extra framework like YUI.
I need a javascript calendar which enables me to customize rendering of calendar-cells on a cell by cell basis. (For rendering events, prices, etc. on a certain date) .
YUI Calendar makes this possible, but I already make extensive use of prototype and don't want to add an extra framework like YUI.
Does anyone know a good alternative?
Thanks,
Brits
Here's one: CalendarView and another CalendarDateSelect.
Have you thought of upgrading from Prototype to YUI or jQuery? Both would give you a lot more functionality than prototype and both have excellent calendar options.
If you've got the time, you can build your own. I've personally used this blog entry to create my own and it works beautifully. The code doesn't use Prototype, but as I was walking through it I converted the whole thing into a Prototype class and used all the nice features of Prototype to make the code look better. And best of all, you know exactly what the tag classes are so you can customize it completely (personally it is easier for me to code the CSS as I go rather than trying to reverse engineer a pre-built one, besides, the equivalent jQuery one may be too much or too little for what you want).
I've used jscalendar before, which works well.
As far as I know, Prototype is a collection of helper functions, but it has no widgets.
YUI is a total different beast (there's a minor overlapping in DOM methods).
We use Prototype for Ajax calls and YUI for widgets (calendar, dialogs, grid).