Jquery Drag and Drop Issues - javascript

I am having a problem with bringing Jquery over to iPad. I made a drag and drop puzzle using Jquery, and on my computer it works fine. When I try to move that over to the iPad, the drag and drop functions cease to work. I have tried many a third party fix for this problem with no avail. Does anyone know how to solve this problem on iOS5? Or is there a better way to code it in HTML5 that works or a Jquery solution I do not know of? Any tutorials on the issue would be appreciated as well. Thanks.

Use jQuery Mobile instead, and make sure you use .preventDefault() as mentioned in this post:
jquery mobile drag and drop
See also: https://stackoverflow.com/a/4488662/362536

See if this helps http://www.gotproject.com/blog/post2.html

Related

Javascript grid with Kinetic scrolling suitable for Mobile/Tablets

I have been looking for a Javascript based datagrid to use for Mobile websites/applications with no luck. I have tried jqGrid, which seemed to work fine except for the lack of kinetic scrolling. I know jqGrid does now have a (beta) mobile version, but unfortunately is is built upon jquery mobile, and I am using a different framework (which spat the dummy when I included the jqquery mobile scripts)
So, my question is, does anyone know of a Javascript grid that does support Kinetic scrolling (or know how to apply this to an existing grid)?
Would need this to not be reliant on any other UI framework (such as jquery mobile - nothing against this, I just happen to be using another one and it didn't seem to want to coexist)
If it supported knockout type of binding then even better!!! (I know this is expecting too much).
Any pointers would be greatly appreciated.
Thanks in advance for any info!
Kinetic scrolling is a built-in feature in Webix DataTable http://webix.com/widget/datatable.
The grid control processes all touch events without a hitch. It runs scrolling touch events especially well http://webix.com/blog/datatable-1000-columns-and-more/.
I know this is a really old question, but I just wanted to leave a note here as well if someone ends up here using the search.
You should check out , which is a top-notch Javascript grid component, and has kinetic scrolling on touch devices. It’s part of Vaadin Components: http://www.vaadin.com/components

Present html page in greyscale

I am looking for the simplest way to make my page appear in greyscale.
I have found plugin (http://james.padolsey.com/demos/grayscale/), but it has some cons, eg. it doesnt handle background images well.
Do you know any alternatives or updates to this tool?
You could try working with a filter:
http://www.html5rocks.com/en/tutorials/filters/understanding-css/
but this might not work on all browsers, certainly doesn't work on old ones.
If you want a cross-browser solution, you'll probably have to rely on javascript
Here's some solutions that I got as answer to one of my questions:
Grayscale.js
jQuery GreyScale plugin
Hoverizr
Do it with canvas (tutorial)
I have used Grayscale.js and it worked ok for me but you could try the other three.

Select doesn't work with flexslider in android (< 4.x)

I seem to face a problem with displaying and selecting the dropdown while using the flexslider in my mobile website.
Here, similar problem was listed. But the solution didn't work for me. I did use useCSS:false, somehow that didn't work for me too.
I use Android GingerBread.
I can submit buttons, enter text, use checkboxes but just not the dropdown. Any advice is welcome.
==Edited==
I found a somewhat similar reported issue here: https://github.com/woothemes/FlexSlider/issues/82
Even if it is a webkit related issue, can anyone suggest any solution for this?
Sometimes the dropdown from other slide is displayed, despite having backface-visibility:hidden.

Mini image browser (like on myfonts.com)

I want to make small image browser like the one used on Myfonts.com (link) in the sidebar under "More fonts like this".
I'm wondering if there is a jQuery plugin that could do that.
I know that this is some kind of carousel, but I couldn't find any with this cool resize function on scroll.
I would suggest you take the jCarousel plugin, as it has a very good base, and modify it to your liking. You could combine it with the jquery ui slider to somehow achieve the same effect as on Myfonts.com.
I did come across something similar although not exactly the same. It might help you figure out how the resizing effect is accomplished. See http://www.eogallery.com/ and http://jquery-ui.googlecode.com/svn/branches/labs/carousel/demo/index.html
As of today I couldn't find any out-of-the-box plugin that does what you are trying to do, but maybe if you build this, you'll post it to the jquery gallery and everyone will live happily ever after :-)

Apple Cover-flow effect using jQuery or other library?

Does anyone know how to achieve the cover-flow effect using JavaScript to scroll through a bunch of images. I'm not talking about the 3D rotating itunes cover-art, but the effect that happens when you hit the space bar in a folder of documents, allowing you to preview them in a lightbox fashion.
http://www.jacksasylum.eu/ContentFlow/
is the best I ever found.
a true 'CoverFlow', highly configurable, cross-browser, very smooth action, has relections and supports scroll wheel + keyboard control. - has to be what your looking for!
Not sure if you're talking about Coverflow (scroll through images) or Quicklook (preview files in lightbox), try editing your question.
Here's some JS Coverflow implementations:
MooFlow - Coverflow for MooTools
Coverflow in JS proof of concept
Coverflow using JS and CSS Transforms (Webkit only)
I think this is what you want http://addyosmani.com/blog/jqueryuicoverflow/
I tried using the the Jack's Asylum cover flow but it wouldn't let me easily remove and re-add an entire coverflow. I eventually found http://finnrudolph.de/ImageFlow and not only is it more reliable, it's easier to hook into, uses less markup, and doesn't jitter when flipping through images. It's by far the best I've found, and I've tried several on this page.
There is an Apple style Gallery Slider over at
http://www.jqueryfordesigners.com/slider-gallery/ which uses jQuery and the UI.
jCoverflip was just released and is very customizable.
colorbox has such amazing features..loving it.
Also like this one http://www.webappers.com/2008/03/05/galleria-simple-but-nice-jquery-image-gallery/
Is this what you are looking for?
"Create an Apple Itunes-like banner rotator/slideshow with jQuery" is an article explaining how you can make such effect using jQuery.
You can also view the
live demo.
Try Jquery Interface Elements here - http://interface.eyecon.ro/docs/carousel
Here's a sample. http://interface.eyecon.ro/demos/carousel.html
I looked around for a Jquery image carousel a few months ago and didn't find a good one so I gave up. This one was the best I could find.
Check out momoflow: http://flow.momolog.info
True coverflow effect, and performant on Webkit (Safari and Chrome) and Opera, ok on Firefox.
Just to let you all know, xFlow! has had some major work done on it and is vastly improved.
Go to http://xflow.pwhitrow.com for more info and the latest version.
i am currently working on this and planning on releasing it as a jQuery-ui plugin.
-> http://coulisse.luvdasun.com/
please let me know if you are interested and what you are hoping to see in such a plugin.
gr
the effect that happens when you hit the space bar in a folder of
documents, allowing you to preview them in a lightbox fashion
Looks like a classic lightbox plugin is needed. This is my favorite jQuery lightbox plugin: http://colorpowered.com/colorbox/. It's easy to customize, etc.
This one looks really promising, and closer to the actual Apple coverflow effect than the other examples:
blarnee.com/projects/cflow

Categories

Resources