background preloader

Articles/tutorials

Facebook Twitter

Underscore

Backbone. Angular. Using HTML5 Drag And Drop To Create A Shopping Cart. The release of HTML5 introduced native Drag and Drop functionality to modern web-browsers.

Using HTML5 Drag And Drop To Create A Shopping Cart

This means it is now possible to have movable elements on screen without the aid of frameworks like jQuery. This week we’ll be taking advantage of the drag and drop functionality to create a basic shopping cart. The basic functionality we’ll cover, will be adding an item to the cart and if it already exists updating the quantity and totals. Getting Started. Drag and Drop Interaction Ideas with jQuery & CSS3. Tutorial: Handle browser events using jQuery JavaScript framework. Handling events in today web browser is a bit difficult part as different browser handles events in a different way.

Tutorial: Handle browser events using jQuery JavaScript framework

Hence to overcome these cross browser problems, one can leverage the Event handling APIs of jQuery. jQuery is a small JavaScript library that provides a vast number of APIs to handle different browser events and effects and a lot more. Read more about handling User interface Effects in Browser using JavaScript. In this tutorial we will explore different API’s of jQuery to handle different browser events. jQuery AJAX Tutorial, Example: Simplify Ajax development with jQuery. jQuery, the JavaScript library provides some powerful set of jQuery AJAX API’s to handle AJAX requests.

jQuery AJAX Tutorial, Example: Simplify Ajax development with jQuery

The normal way of making AJAX calls using JavaScript is a bit odd as you have to first create an XMLHttpRequest object that depends on the browser and then make an AJAX call. Also sending a form data using AJAX is also bit difficult if we use normal JavaScript approach of calling AJAX. jQuery provides simple yet powerfull functions which have extended the JavaScript AJAX methods and provide more flexible way. Let us see different ways of doing AJAX things in jQuery. GET Request method using jQuery. Object-Oriented programming with JavaScript. OO Concept in JavaScript. Object-Oriented programming is one of the widely used programming paradigm that uses abstraction to create model based on real world.

Object-Oriented programming with JavaScript. OO Concept in JavaScript

It is a model organized around “objects” rather than “actions” and data rather than logic. Historically, a program has been viewed as a logical procedure that takes input data, processes it, and produces output data. Object-oriented programming (OOP) uses “objects” – data structures consisting of datafields and methods – and their interactions to design applications and computer programs. Each object can be seen as a tiny machine which is responsible for the set of task assign to it. Today, many popular programming languages (such as Java, JavaScript, C#, C++, Python, PHP etc) support object-oriented programming (OOP). 5 Ways that CSS and JavaScript Interact That You May Not Know About.

CSS and JavaScript: the lines seemingly get blurred by each browser release.

5 Ways that CSS and JavaScript Interact That You May Not Know About

They have always done a very different job but in the end they are both front-end technologies so they need do need to work closely. We have our .js files and our .css, but that doesn't mean that CSS and JS can't interact more closely than the basic JavaScript frameworks will allow. Front-end Style Guides. We all know that feeling: some time after we launch a site, new designers and developers come in and make adjustments.

Front-end Style Guides

They add styles that don’t fit with the content, use typefaces that make us cringe, or chuck in bloated code. But if we didn’t leave behind any documentation, we can’t really blame them for messing up our hard work. To counter this problem, graphic designers are often commissioned to produce style guides as part of a rebranding project. A style guide provides details such as how much white space should surround a logo, which typefaces and colours a brand uses, along with when and where it is appropriate to use them.

Atomic