Ajax Updates

Posted by education training on Sunday, September 6, 2009

Ajax Updates

EnlargeIt Updated with Javascript

Posted: 06 Sep 2009 08:26 AM PDT

EnlargeIt! is a little Javascript you may use in your HTML pages. It enlarges thumbnail images beautifully with a mouse click. You can use different animations if you like. You may add AJAX content to your files.

Features:

* really easy to integrate
* works for pictures, flash files, FLV videos, YouTube videos, DivX videos and iframes
* enlarge several files at the same time
* grouping of and navigation between files
* optional title bar and buttons
* several options to individually style your border
* easily add AJAX content – e. g. desciption pages – to your images
* supports hidden call of a counter page
* lightweight – the javascript file is only 11 – 22 Kbyte in size
* works with any web browser of the last years – see manual for details
* under GNU GPL 3.0 license for free software

U can also chose your settings in the box at the right, then click submit and play with the pictures!
If you turn off darkening, you can enlarge more than one pic at a time and drag them around your screen.
Flash files and YouTube movies do not yet support animation and drag&drop.




Demo: http://enlargeit.timos-welt.de/english/11/demomachine.php
Download: http://enlargeit.timos-welt.de/english/11/EnlargeIt_1.1_20081219.zip
Source: http://enlargeit.timos-welt.de/english/index.php
tafbutton blue16 EnlargeIt Updated with Javascript

Related Listings:

  1. EnlargeIt Images Script EnlargeIt! is a little Javascript you may use in...
  2. ShadowBox Light Box using Javascript Shadowbox is an online media viewer application that supports all...
  3. LightboxXL – Prototype Plugin We all know how good and how famous lightbox is...

New Fancy Upload version 2.0

Posted: 06 Sep 2009 08:00 AM PDT

Swiff meets Ajax for powerful and elegant uploads. FancyUpload is a file-input replacement which features an unobtrusive, multiple-file selection menu and queued upload with an animated progress bar. It is easy to setup, is server independent, completely styleable via CSS and XHTML and uses MooTools to work in all.

Features

* Select and upload multiple files
* Filter files by type in the select dialog
* A lot of possible Events to add your own behaviour
* Show and filter useful file information before the upload starts
* Limit uploads by file count, type or size
* Platform and server independent, just needs Flash 9+ (> 95% penetration)
* Graceful Degradation, since the element is replaced after the Flash is loaded successfully
* Cancel running uploads, add files during upload
* Everything is optional, documented and easy editable
* New in 2.0
o Get the server response after upload for showing additional informations or previewing the image, etc.
o Shows the current upload speed and the time left
o Send additional request data via GET or POST variables
o Set the filename for the upload request
* New in 3.0 (Completely rewritten API)
o Fully Flash 9 and 10 compatible and an additional IFrame-based uploader
o Browse-button can be an invisible overlay or an interactive image sprite
o Event based Flash communication, future-proof und more stable
o File-specific options for setting url, data and method, intelligently merged
o Append cookies automatically to the request data
o Relative URLs are converted automatically



Demo: http://digitarald.de/project/fancyupload/3-0/showcase/attach-a-file/
Download: http://cloud.github.com/downloads/digitarald/digitarald-fancyupload/working-fancyupload-photoqueue.zip
Source: http://digitarald.de/project/fancyupload/
tafbutton blue16 New Fancy Upload version 2.0

Related Listings:

  1. FancyUpload – Swiff meets Ajax v2.0 Swiff meets Ajax for powerful and elegant uploads. FancyUpload is...
  2. Ajax Simple Upload Browsers force us to use file inputs () for uploads,...
  3. Multiple File Upload – JQuery The Multiple File Upload Plugin (jQuery.MultiFile) is a non-obstrusive plugin...

jQuery Virtual Tour

Posted: 06 Sep 2009 07:40 AM PDT

This virtual tour plugin has the particularity to be accessible and can run even if javascript has not been activated] : navigation uses the standard html tags and in accordance with w3c.

No need for Flash, Quicktime ou Java. Your visitors will not have to install any software to experiment your virtual tour.

We are building this extension for a current project : a game around art workcraft for Casa d'Art.

Note : Vertical text is displayed using the jQuery flipv plugin.

Usage:

- In the section, insert CSS ans javascript calls :
 Javascript |  copy code |? 
01
link rel="stylesheet" type="text/css" href="css/thickbox.css" media="screen" /> 
02
<link rel="stylesheet" type="text/css" href="css/jquery.panorama.css" media="screen" /> 
03
<script type="text/javascript" src="js/jquery.js"></script> 
04
<script type="text/javascript" src="js/jquery.panorama.js"></script> 
05
<script type="text/javascript"> 
06
	$(document).ready(function(){ 
07
		$("img.advancedpanorama").panorama({ 
08
	                auto_start: 0, 
09
                        start_position: 0 
10
			/* add your execution parameters here */ 
11
	         }); 
12
	}); 
13
</script> 
14
<script type="text/javascript" src="js/cvi_text_lib.js"></script> 
15
<script type="text/javascript" src="js/jquery.advanced-panorama.js"></script> 
16
<script type="text/javascript" src="js/jquery.flipv.js"></script> 
17
<script type="text/javascript" src="js/thickbox.js"></script>

- In the < body > section, add the panoramic image call, and the < map > object containing interactive areas coords (only 'rect' type are supported).

If the < area > is pointing to a picture, you could add the 'thickbox' class to have a pretty effect using the Thickbox plugin.

 Javascript |  copy code |? 
1
<img src="img/sculpteur.jpg" class="advancedpanorama" width="2448" height="375" usemap="testmap" alt="Atelier du sculpteur" /> 
2
<map id="testmap" name="testmap">  
3
		<area shape="rect" coords="1653,72,1839,255" href="index.html" alt="vers la salle de formation" />  
4
		<area shape="rect" coords="2013,114,2091,210" href="img/statue1.jpg" alt="statues" class="thickbox" />  
5
		<area shape="rect" coords="1920,276,2070,351" href="img/gouges.jpg" alt="gouges" class="thickbox" />  
6
</map>
And take a look at the example on the zip file.



Demo: http://openstudio.fr/jquery-virtual-tour/
Download: http://www.openstudio.fr/download/jquery-virtual-tour.zip
Source: http://www.openstudio.fr/jQuery-virtual-tour.html?lang=en
tafbutton blue16 jQuery Virtual Tour

Related Listings:

  1. jQuery Virtual Tour Script This virtual tour plugin has the particularity to be accessible...
  2. jQuery ThickBox Script ThickBox is a webpage UI dialog widget written in JavaScript...
  3. jQuery Tabs Address – Deep linking plugin The jQuery Address plugin provides powerful deep linking capabilities and...

0 comments:

Post a Comment

Note: Only a member of this blog may post a comment.