cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv

Posts tagged jquery

Image Preview beim File Upload mit jQuery

Hier kommt ein einfaches Tutorial, wie man ein ausgewähltes Bild über <input type="file"> anzeigen lassen kann, ohne ein Plugin zu verwenden. Alles was wir dafür brauchen ist ein...

Positioning issue in iOS devices

Problem in Position:fixed

While developing an app, i found strange issue with the elements have property as "posiiton:fixed;".

In my app i used this property to fix the navigation bar at...

Cross Stitching with jQuery

Something about this summer reminded me of how much I liked to cross stitch when I was a kid. This summer I've been pointing all my crafty energy at Actually Getting Good at jQuery (For Real...

Simple AJAX via jQuery .load()

A dead-simple AJAX request using jQuery's .load() method.

Simple AJAX via jQuery .load()

Syntax error, unrecognized expression: jQuery

I am working on a Symfony based website, and uses the jquery gallerific plugin by Trent Foley for the gallery module. Everything is working fine but suddenly got a weird error:

syntax error...

CSS Transition Height Fixed-Auto The Easy Way

The Problem

CSS transitioning height (or width) between a fixed value and the block's auto size currently doesn't work in most (all?) browsers. However CSS Transitions are faster, easier,...

Filter Divs With jQuery

I recently needed to filter divs by their class when people pressed the appropriate button. At first I took a look at plugins like Isotope and MixItUp, but they bring in thousands of lines of...

[jQuery] $.fn (alias of prototype)

Soooo What does the 'fn' here mean?


In jQuery, the fn property is just an alias to the prototype property.

The jQuery identifier (or $) is just a constructor function,...

Bowie Ipsum - A Glam Dummy Text Generator

Recently I've had problems with my go-to dummy text generators. My long-time favorite started inserting a URL into the text as some weird SEO scheme (I'm sure that's working out great),...

Cut out the jQuery middle man

Let me start by saying that this is not a "break-up with jQuery post" - in fact, I like jQuery and know that we all owe it a great debt. jQuery does great things for normalising...

Full page sliding

You may have seen it once on the Apple website, and since then on several websites: the full-page sliding pattern is quite popular for displaying presentations (full page schemas/animations, etc.)...

Using Animated GIFs to Debug Complex DOM Changes

With web sites/apps becoming more and more dynamic on the front-end, it can be difficult to see exactly what modifications JavaScript is making to elements in the DOM.

To help, I've taken the...

jQuery plugin: .deepest()

I was inspired to write this plugin by a Stack Overflow question and answer.

Someone else created a jQuery plugin from the answer as well, but it doesn't have all of the hallmarks of a robust...

How to dynamically add options to entity form field in Symfony2

In this post I am going to show how to dynamically add an option to a select in Simfony2. It is a common situation, where the developed application has an entity with associated subcategory to it....

Bouncing Balls Hints

If you need a few tips to get you started on a solution to the bouncing balls problem, here are six to get things rolling.

Step 1

You'll need a box to hold all the balls.

Since we're using...

Jquery Examples

Jquery Example

In this post there are really cool JQuery examples that you'll certainly find interesting and useful.

Below is the list of very cool JQuery example:

Magic Header

JavaScript Tutorials

JavaScript Tutorial

In this post, I'll put Mr. Adam Khoury's JavaScript tutorial videos. From start to end.

Below is the list of very cool JQuery example:

01 - Fullscreen API JavaScript Code Examples...

A useful function for making querySelectorAll() more like jQuery

Through LibUX I try to evangelize the importance of speed — or the perception of speed — to the net value of the user experience. People care.

Of the many tweaks we can make to improve...

Onload Handler

window.onload event fires when a document is completely downloaded to the browser. This means that every element on the page is ready to be manipulated by JavaScript, which is a boon for writing...

THIS - Context in Event Handler

The $() function can take a DOM element as its argument. This is a key reason why the keyword this refers to the DOM element on which an event handler was has been triggered.

By writing $(this)...

Event Handlers

jQuery always triggers event handlers in the order in which they wereregistered.

Context keyword this contains a DOM element rather than a jQuery object and as a result, it gives access to native...

Event Delegation

With the event delegation you can make use of event bubbling and create an event handler on a single element to do the work of many. For example, instead of adding a separate .click() handler to...

HTML5 CurrentTime and Frame Numbers

I recently had the opportunity to dive into HTML5 video and I quickly realized how powerful and customizable it can be. I was building a simple interactive player with looping and chapters. When...

jQuery Horizontal Slide + Easing

jQuery's slideToggle() is great. But what if we want it to work horizontally instead of vertically?

Using slideToggle():



I am shy

The old school


Scroll-based animation (from SitePoint)

Sitepoint published Creating Scroll-based Animations using jQuery and CSS3 (July 2015) containing the following jQuery technique for triggering animations when scrolling into a pre-defined region....

Need help with jQuery

Need Help With jQuery

I need help. I just started learning jQuery via Code Academy and when I try to do it here it here or anywhere it won't pick it up even though Code Academy says I got...


<!doctype html>

 <a href="#" data-type="facebook" data-url="http://sonnyt.com/prettySocial" data-title="prettySocial - custom social...

8 Creative Demos that Show the Power of IsotopeJS

Isotope is a jQuery plugin that can be used to create dynamic layouts with easy filtering and sorting of elements. Isotope is similar to Masonry, but with more features. Isotope has several layout...

[ES] Swipe Menú con jQuery

Aprende a crear un menú con efecto swipe en dispositivos móviles.

Swipe Menu jQuery


Esto es facil de hacer gracias a jQuery mobile, que incluye un...

Making A Custom ToolTip

Recently, I had to make a custom tooltip when we hover over icons. I did'nt wanted to insert lot of HTML, laziness most probably but also the amount of markup that the browser would have to...

#10 React drops

When we want to create a masked input, we have many jquery plugins that do this work for us, let's use them on our components.

[[[pen slug-hash='MyjqGa' height='300'...

jquery, y frameworks



MDL - getmdl.iohttp://getmdl.io


jQuery: Big Functionality in a Small Library

There's one small library that has had a huge and lasting impact on modern web development: jQuery.

Simply put, jQuery brings together unified functionality for developing solutions that address...

Простые задачи по JS(jQuery)

есть кнопка и скрытый текст рядом. При клике на кнопку текст рядом плавно появляется. Анимацию появления сделай тоже через jquery.

при скролле страницы(через пару скроллов) показывать справа-внизу...

Parsing the JSON object array and build an HTML List

One of my friend is learning jQuery and JavaScript and asked me How to create a Dynamic HTML un-orderd list where the list template is provided and has to be build up using the data from the json...

Jquery hangman

Hangman Jquery

Jquery is fun and easy

Make Data More Interactive with Tablesorter

A key goal to keep in mind when developing software such as a modern web site is to provide the user with interactivity. Static content isn't bad; but it can become boring or the user may lose...

jQuery - Creating elements


This is probably the easiest way of doing this. Just print the HTML you'd like to have in there, and jQuery will take care of transforming it into a node element.It's a good way...

Interactive retro radio player

Interactive 70's radio player / Pure CSS/Jquery

Check out the full working version here
Interactive Sangean WR-11 radio player, made purely with CSS &...

Things you should know about Javascript.

This document is to share some of the Javascript weird parts and other interesting stuff you should know. Javascript is an awesome scripting language to learn and master, yet its not easy to...

A Quick jQuery Tip.

Actually, its not a -jquery-only-tip as this is something could hel you in many other things. But as long as we are going to use jQuery in our examples so couldn't find a better title though.


jQuery-valitsimet (jQuerysta lyhyesti, osa 1)



valitsin - selector

elementti - element

tunniste - ID


syntaksi - kirjoitusmuoto

DOM - Tulee sanoista Document Object Model. DOM perustuu siihen, että jokainen HTML-elementti...

DOM-manipulaatio, (jQuerysta lyhyesti, osa 2)



manipulaatio - manipulation

elementti - element


syntaksi - kirjoitusmuoto

DOM - Tulee sanoista Document Object Model. DOM perustuu siihen, että jokainen HTML-elementti on oma...

Lite Tooltip using jQuery

A very lite tooltip using jQuery. Works on touch devises. Allows to interact with markup inside the tooltip.


<div data-lite-tooltip="{{content goes here}}"...

Javascript plugin



Lorem ipsum dolor.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae, itaque. 11-21-2016

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur...

Incorporate Horizontal Scrolling (Mousewheel)

During the design process of an older idea for my portfolio I felt I had an issue. I wanted to display my content horizontally and thus I felt the viewer/user would feel a lot more comfortable with...

jQuery Toggle

How to use the toggle function in jQuery, RE: images. There are, of course, three parts that we need to consider, the HTML, the CSS and the all-important JavaScript.


To acomplish my goal of...


Hello people!

This is my first codepen, my first git repository and my first share, i hope im doin it right.

this is my rCalc.

why r? because i want and i can, and its because i am Raziel.

Ive seen...

jQuery Lookups - jQuery Objects

What is a jQuery object?

A jQuery Object is an object that has the set of jQuery methods and properties like .html() or .remove() and points to a specific DOM node (HTML element). Some of the main...

jQuery Lookups - Filtering and Extending

(!) You might understand this article better if you have read the previous article in the series.

Lookups are usually one of the first and most useful things you need to learn when using jQuery. But...



Which stands for Asynchronous JavaScript and XML is used to load content into a page without refreshing the browser.

It can be used in a number of ways, such as loading a confirmation message...

Make it Rain: a fun SVG Animation Project for Beginners

In this exercise, we will use CSS and jQuery to animate an SVG scene according to the storyboards provided for us by the designer. Feel free to fork the starter SVG file and get started:


jqgrid get data получить данные с любой таблицы

//Получаем данные$(Ваша таблица).jqGrid('getGridParam','data')

//Устанавливаем данные$(таблица куда устанавливаем).jqGrid('setGridParam', { datatype: 'local', data:...

Interface as navigation

Yesterday, I created a layout where the interface is the navigation. This is not uncommon with tiled layouts and is an homage to Microsoft's Metro style released in Windows 8. Here's the...

when i append div on document ready, my style is not applying on page refresh.

  <h1>Swipe 2</h1><div id='mySwipe' style='max-width:500px;margin:0 auto' class='swipe'> <div class='swipe-wrap'> </div></div>...

How I learned to stop worrying and love libraries.

How I learned to stop worrying and love libraries.

I used to strongly dislike libraries under the reasoning of not liking the bulk or the abstraction or unneeded complexity. But just recently it...

Who can help me? How to resize the parent div together with the child collapsible div?

I have a parent div used to make my child panel resizable and draggable. Now I wanted to do the panel collapsible. But when it collapses the parent panel should disappear too ... but it is not...

Валидация формы JS

$(document).ready(function() {


function(value, element, regexp){var re = new RegExp(regexp); return this.optional(element) || re.test(value);},


Collapse Button not working

Hey guys im trying to get this menu up and running for my portfolio page but the button to allow you to view the menu in small screen is not dropping down. I have looked over my code and cant...

Full-Screen Unsplash Slideshow

I recently created a full-screen, auto reloading app that pulls in images from an Unsplash.com collection. You can sit back and let the auto refresh do its thing every 10 seconds, change it to more...