Ajax Image Gallery Uploader - javascript

I was just wondering what is the best image uploader with a gallery and ordering abilities. What I had in mind was a back-end page that has thumbnail images to the left, and an image upload panel to the right. When an image gets uploaded, the thumbnails in the left gets updated. I also need a delete function on all of the thumbnails; maybe when they hover over an image, an "x" could appear, which when clicked, will delete the image. I'll also need dragging capabilities so that the user can rearrange the ordering of the images.
I was hoping for all this to be using javascript and ajax. I think it should be possible because I can find each piece from separate plugins, but I want one that encapsulates all of them together.

you have to use Uploadify from http://www.uploadify.com/demos/
and customize it as u need.
there is no prebuilt solution for your case.

Related

Small sliding, loop gallery

I'm working on a website and I'd like to add a photo gallery. The gallery should work as follows:
The gallery has a rectangle/box form. I have, let's say, 10 photos. 7 of them are displayed in a gallery, the rest is hidden. By clicking buttons "left" or "right" we can move photos in the given direction and so view a photo that was hidden (and hid a photo that was on the far left or right side). The gallery should be loop, so a button won't stop moving photos when it reaches the last photo, but start viewing photos from the beginning (starting with the very first one) instead. I know HTML and CSS, but, if I'm right, CSS itself is not enough to make such gallery. I think I need some Javascript code for this, but I don't know JS. I've searched on the net for JS gallery scripts, but none of them works and looks as I'd like them to work and look.
Try bxSlider. I think it offers exactly what you need.

new to javascript- image gallery- thumbnails expand to full size when selected

work in progress- live site
I have a gallery page with several sub-pages. Each sub-page has a row of thumbnails on the left. When one of the thumbnails is selected, it will show larger on the right. This is a Wordpress site, but I've been told that JS might be the best route to take. I'm fairly inexperienced with JS, so I'm unsure of how to go about this.
How do I go about showing the thumbnails and the selected image?
There are lots of jQuery (jQuery is very powerful!!) gallery plugins can do what you need. Check out this awesome site awesome jQuery tutorials, there are many detailed tutorials about how to build inspiring image gallery.
Except JS/jQuery, you also need to know how to use Html && CSS.
The basic idea is show/hide(static or load by ajax dynamically) your big image when hover() your thumbnails.

Image popup, without postback?

I am making my own photo album, and want to copy the functionality of a well known photo sharing site. What I am looking for is - how do they do this?
http://www.flickr.com/photos/cdotlister/6445556533/in/photostream/
That's a photo of mine. If you click the photo, you get an enlarged version. The initial one and the large one are the same file size, so, must be the same file. I think the smaller one is resized using html. (image height and width). And then the popup version is probably the actaul image size.
However, when the image is popped up - resize your window. It stays centred.
I'd like to replicate this... I assume it'd ajax? I'd like to know how I can have a click event on the image, display a popped up version of the same image.
Take a look at jQuery lightbox pluggin.
http://leandrovieira.com/projects/jquery/lightbox/

JavaScript / jQuery gallery that supports images and swf?

I'm looking for a simple JavaScript / jQuery gallery with the following features:
There should be some thumbs on the page and a large image.
When a thumb is clicked the large image is replaced with with a large image of the thumb.
If a particular thumb image is clicked a swf is loaded in place of the large image.
It would be nice if there was a transition effect when the large image is swapped out when the next thumb is clicked.
I tried to build something, but it was too buggy. I have seen many galleries which support both images and swf files but they open in a lightbox and this is not what I want.
Does anyone have any ideas?
my friend one of the easiest and the best is pikaChose
Simplest demo fulfilling your needs
pika chose simple gallery
integration with lightbox/fancy box
fancy box pika chose
Just go through the code once and you wills surely love it
FeaturedContentSlider has the thumbnail functionality you mentioned, and is a jQuery slider that supports swf files (each slide accepts any html content you put in it, even if the demo dosn't illustrate that). Here's the link! http://css-tricks.com/examples/FeaturedContentSlider/

Draw a box on an image, javascript only?

What i want to do is have a user upload his image. When its complete it will display the image on the same page w/o refreshing. Here is the part i need to figure out, how do i have the user select a box in the image? so i can crop it when the user is done? (using ImageMagick).
If possible i would like a border for the user to stretch to edit the width and height. Then click within the rect to move around.
There's a ton of ways; including several pre-written plugins available through the web.
Are you using any frameworks?
Of the below, I've used Jcrop and Lasso.Crop and they've both worked out well. Haven't tried the others.
Here's a non-exhaustive listing:
Pure Javascript
http://www.dhtmlgoodies.com/index.html?whichScript=image-crop
jQuery
http://deepliquid.com/content/Jcrop.html
MooTools
http://www.nwhite.net/2009/02/25/lassocrop-preview/
Prototype
http://www.defusion.org.uk/code/javascript-image-cropper-ui-using-prototype-scriptaculous/

Categories