15 snippets pour améliorer votre utilisation de jQuery La librairie jQuery est une des meilleures, voire la meilleure librairie Javascript actuellement. Elle est assez facile à utiliser et à prendre en main, mais bien souvent, quand on débute, on profite des plugins sans trop savoir comment ils marchent. Car des plugins jQuery, il en existe en veux tu en voila sur la toile. On les télécharge, les utilise et si on rencontre un souci, on change de plugins. La flemme ou pas les connaissances pour mettre les mains dans le cambouis peut souvent entrainer un délaissement d’intérêt. Je viens donc vous proposer quelques trucs et astuces qui pourront grandement vous servir durant vos dev, afin d’améliorer un peu vos connaissances. CheatSheets Pour débuter, voici deux fichiers très utiles qui regroupent les principales propriétés de jQuery et jQuery CSS : Télécharger jQuery 1.4 CheatSheet Télécharger jQuery CSS CheatSheet Document.ready Pour charger vos méthodes au chargement de la page, vous avez surement l’habitude d’utiliser : jQuery 1ere méthode : 20FéV
Comment détecter quand la souris quitte la fenêtre du navigateur en Javascript - Agence Web Paris | Création de sites internet - Blog Javascript est un langage très utile pour beaucoup de choses de nos jours. Malheureusement, chaque navigateur l’implémente à sa façon, et évidemment ils ne proposent pas la même gestion des évènements ! Prenons un exemple : vous venez de faire un div que l’on peut déplacer à volonté avec la souris. On clique, le déplacement commence… on relâche, le déplacement s’arrête. Mais voila, si on relâche en dehors de la fenêtre du navigateur, aucun événement n’est déclenché, et on continue à déplacer notre div indéfiniment ! Le meilleur moyen d’éviter ça est de stopper le déplacement dès l’instant où l’on quitte la fenêtre du navigateur. On commence par se dire que si l’on cesse de survoler l’objet que l’on déplace, on arrête le déplacement… Et l’on se rend vite compte que ce n’est pas pratique du tout ! Pour éviter ça, on peut chercher à déterminer vers quel élément la souris à quitté la div, et n’arrêter le déplacement que si ce n’est pas un élément inclus dans la balise html.
Comment appeler une méthode d’un objet Javascript via setTimeout et setInterval ? | Epershand Pré-requis pour ce tutoriel Un navigateur web (Mozilla Firefox, Google Chrome, Safari aux choix)Un outil de développement (Coda, Dreamweaver, Aptana, Notepad++, etc.)Des bases en programmation Javascript Utilisation classique des fonctions setTimeout et setInterval En Javascript, les méthodes setTimeout(callback, timer) et setInterval(callback, timer) sont utilisées pour appeler une portion de code de manière décalée dans le temps. Le code représenté par callback est appelé au bout de timer millisecondes écoulées après l’appel d’une de ces deux fonctions. La différence entre ces deux fonctions réside dans le fait que « setTimeout » n’appelle qu’une fois la portion de code, alors que « setInterval » appelle régulièrement la portion de code, toutes les timer millisecondes. Voici comment ces deux fonctions s’utilisent : function myFunction() { alert('Hello world !') Utilisation dans un contexte objet setTimeout('this.myMethod()', 1000); Cela revient à écrire : window.alert('Hi everybody');
Geocoding Service - Google Maps JavaScript API v3 Overview Geocoding is the process of converting addresses (like "1600 Amphitheatre Parkway, Mountain View, CA") into geographic coordinates (like latitude 37.423021 and longitude -122.083739), which you can use to place markers or position the map. Reverse geocoding is the process of converting geographic coordinates into a human-readable address. The Google Maps API provides a geocoder class for geocoding and reverse geocoding dynamically from user input. When you first load the API, you will be allocated an initial quota of Geocoding requests. Geocoding Requests Accessing the Geocoding service is asynchronous, since the Google Maps API needs to make a call to an external server. You access the Google Maps API geocoding service within your code via the google.maps.Geocoder object. The GeocodeRequest object literal contains the following fields: These fields are explained below. * Note: You may pass either an address or a latLng to lookup. Geocoding Responses Geocoding Results Status Codes
Getting Started - Google Maps JavaScript API v3 The Maps JavaScript API lets you customize maps with your own content and imagery for display on web pages and mobile devices. The Maps JavaScript API features four basic map types (roadmap, satellite, hybrid, and terrain) which you can modify using layers and styles, controls and events, and various services and libraries. Audience This documentation is designed for people familiar with JavaScript programming and object-oriented programming concepts. You should also be familiar with Google Maps from a user's point of view. This conceptual documentation is designed to let you quickly start exploring and developing applications with the Maps JavaScript API. Hello, World The easiest way to start learning about the Maps JavaScript API is to see a simple example. View example. Even in this simple example, there are a few things to note: We declare the application as HTML5 using the <! These steps are explained below. Declaring your application as HTML5 Loading the Maps JavaScript API HTTPS or HTTP
jquery_ui_map_v_3_sample_code - jquery-ui-map - Sample code - Google map v3 plugin for jQuery and jQuery Mobile Example constructor call Make the selected element a Google map. $('#map_canvas').gmap(); Map options are added in the constructor or set with the option method The map options is extended with a callback function which will execute when the Google Map object has been instanciated. When the map is fully initialized (with bounds) it will trigger the 'init' event. $('#map_canvas').gmap().bind('init', function(event, map) { // do something }); All properties in the MapOption object can be set and retrieved by Get the zoom var zoom = $('#map_canvas').gmap('option', 'zoom'); Set the zoom $('#map_canvas').gmap('option', 'zoom', 7); Example add custom control $('#map_canvas').gmap().bind('init', function() { $('#map_canvas').gmap('addControl', 'control', google.maps.ControlPosition.LEFT_TOP); }); $('#map_canvas').gmap('addControl', 'control', google.maps.ControlPosition.LEFT_TOP); Example add marker Example InfoWindow Close any open InfoWindow $('#map_canvas').gmap('closeInfoWindow'); Example JSON response
EFFET DE ROTATION A 360° D'IMAGE AVEC ACCELERATION DECELERATION diaporama, acceleration, deceleration, iphone, rotation 360, Source N°54059 Javascript c'est un effet de rotation a 360 degré avec plusieurs images utilisant la souris sur la zone ou ce situe l'image on peut aussi pousser l'image afin de créer un effet d?accélération décélération j'y est ajouter le préchargement des images afin d'assurer la fluidité de l'animation le script fonctionne avec firefox chrome opera et ie testé avec ie 8 et je pense qu'il doit pouvoir marcher avec ie 6 lien teste Source / Exemple : Conclusion : ca roule jQuery Reel Plugin verb ... the room reeled GO ROUND, go round and round, whirl, spin, revolve, swirl, twirl, turn, swim. Try dragging this area or roll your mouse wheel over it Now even on Android Reel 1.3 is an established and the most versatile three-sixty player for jQuery. Modes covering beyond usual 360° span. back up Demonstration An image is worth a thousand words. Try reel for yourself. Stitched panoramas are supported too: You can also embed annotations (e.g. text or images) of individual features on the scene. See all 19 examples incl. code samples Is it compatible? Runs everywhere! * Under the hood Reel uses nothing else than CSS background image positioning which is pretty common in all today's browsers. Who uses it? Everybody! Latest news To date, Reel is used on 2014+ domains world-wide. NEW Reel 1.3 has been released and as usual brings many fixes and enahncements. The CDN has run dry today and was rejecting requests. Reel 1.1.3 doesn't add any new functionality or options. Download Syntax