Check Your Internet Speed

Showing posts with label J-QUERY. Show all posts
Showing posts with label J-QUERY. Show all posts

Cool Attractive jQuery Tab Module

Tabulous.js is a great jQuery tab module. With its supports of animations while loading its tab content, I reckon you can use this plugin to create a cool website layout.
Imagine this, you use tabs as navigation menu, and load your website content with a few supported animation effect such as Scale, Slide left, Slide Right and Flip. Simple as that, you just create a good looking web layout with I Developments. Go ahead and see the demo, you need to play with it to understand what I meant.

Features

  • Easy to setup
  • Support animation effect - Scale/Slide Left/ Slide Right/ Flip
  • Lightweight

Screenshots

More Details

Source: www.queness.com

Latest Effects Of JQuery Plugins

Just found this useful plugin, in cas eyou are looking for a way to add nice hover effects, this plugin is ideal.

Available Options:

  • startEffect : Default style of image
  • hoverEffect : Image style on mouse over
  • imageOpacity : opacity of image considered when start effect is transparent or overlay
  • animSpeed : Animation speed for the effect
  • fillColor : Overlay color
  • textColor : Text Color
  • overlayText : Default HTML to be displayed on overlay
  • slices : Number of slices for slice animations
  • boxCols : Number of boxes in a row for box animations
  • boxRows : Number of rows for box animations
  • popOutMargin : Margin of Image popout
  • popOutShadow : Shadow length of popout image. Shadow works for those browsers which support text-shadow css.

Start Effects

  • transparent
  • normal
  • overlay
  • grayscale
  • Hover Effects:
  • normal
  • popout
  • sliceDown
  • sliceDownLeft
  • sliceUp
  • sliceUpLeft
  • sliceUpRandom
  • sliceUpDown
  • sliceUpDownLeft
  • fold
  • foldLeft
  • boxRandom
  • boxRain
  • boxRainReverse
  • boxRainGrow
  • boxRainGrowReverse
Download
Demo and more info
Source: www.webdesignshock.com

The Most Amazing JQuery Sliders

Hi everyone. We are proud to present our latest product : jQuery Slider Shock. A fully responsive slider and the most complete over the web right now. Available for you to download it as a jQuery code to use it wherever you need, or as a plugin for the most used CMS: WordPress. We wanted to make something that could take advantage of all the power that the jQuery code has to offer and this is the result. Take a look into this post and the features that our slider has to offer.
Do you want to build your own Slider? Sure, you can do it!. Look at the controls available to do so.
You can test these features in the jQuery slider shock demo site and clicking on the option Build your own. You will see that basically the slider can fit everywhere!. But that is not all, the Slider comes with some good features we cheer you to read below:
  • You can easily add thumbnails on any of the sides of the slider ( top, bottom, left, right ) allowing users to navigate easily between slides.
  • jQuery Slider Shock supports not only images but also allows you to show Videos from YouTube playlists, RSS Feeds, Twitter Feeds, Flickr and Instagram images from an account.
  • You can create an slider from each of the following sources: Custom Slides, Posts (WordPress), Custom Post Types (WP), Taxonomies (WP), External RSS, YouTube, Flickr, Twitter and Instagram.
  • Add videos from YouTube, Vimeo or Hulu.
  • Create a unique slider adding not only videos or only images, but both of them between slides.
  • Thanks to the shortcode the slider generates, you can add it anywhere inside your pages, posts or widgets. (for WP) or via JS code for non WP environments.
  • You can have as many sliders as you want in the a single page.
  • Add a flat color or a pattern based background the captions in the slides.
  • You can add text or html based captions, including title and description, for WP, caption can also include author and date.
  • You can adjust both the position and width of the slider captions.
  • You can also include external URL images. By doing that, you can add completely different background patterns to your slider.
  • Choose if your images or videos are shown slow or fast defining the delay time.
  • You can choose a fixed width for your images, or adjust them to the 100% of its parent width.
  • Adjust image to where you need them to be using margin values.
  • Add image descriptions within the thumbnail labels and display them on top, bottom, left or right side of your slider.
  • Like the images, the labels can have their own background.
  • Text formating for title and content. Color, size, bold, cursive and family available for them to be set and changed.
  • Show as many slides as you want.
  • Since the slider is fully responsive, you won’t need to worry about your slider stop working on small screen devices.
  • You can adjust both the position and width of your captions.
  • Pick one from 31 available effects (premium) or let them be random.
  • Responsiveness can be deactivated, allowing your slider to remain the same disregarding the screen size.
  • You choose the skin that fits on your site the best from 39 skins.
  • Give your slider a completely different appearance just changing the look of the arrows.

Now  going  to  the  practice,  Lets  take  a  look  into  how  this  looks:

Editing the thumbnails, you can place them whenever you want.

Adding content from twitter, or any other external source: flick, instagram, youtube, vimeo, rss, etc

Adding content from YouTube with no captions or thumbs.

No captions at all, only images taken from custom post in wordpress or jquery.

Inserting content from Instagram, you can change the colors and sizes of everything.

If you like it, don’t miss the chance to check this amazing slider.

You may go now and feel free to start using the slider. Be one of the first people to have it and show it!. You can choose now between a personal license to start using the slider for free, or a commercial license to have access to everything. even to modify it. You can check the pricing options by going to the page. If you already have downloaded jQuery Slider Shock, dont forget to read the documentation to guide yourself for further assistance.
We hope you have enjoyed this post. We are always glad to bring you our material. Looking forward to bring you more in the future.

Source: www.webdesignshock.com

Latest jQuery Rating Plugins

Find collection of 8 Free & Best jQuery Rating Plugins. These plugins are easy to use and can be implemented in your website for any kind of Poll, Vote or to include ratings. Enjoy!!!!


jQuery Raty



jQuery Bar Rating Plugin



jQuery quickie



jQuery SimpleRating plugin



jQuery Star Rating Plugin



RateIt



jRating



jQuery Rater



Source: jquerybyexample.blogspot.com

jQuery refered Use protocol less URL

Learnt something new today and thought of sharing. Most of us, include the reference of jQuery library (if Google CDN is used) like this,
1http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
As you can see it is using HTTP protocol. The advantage of Google CDN files are cached up to one year which means that your users may not need to download jQuery at all. But when you move from HTTP to HTTPS pages, then you need to make sure that you are using https protocol for referencing jQuery as pages served via SSL should contain no references to content served through unencrypted connections. 
And take a note that content served via SSL are not cacheable. Browsers will simply ignore content served over SSL for caching. So you need to make sure that if you are moving from HTTP to HTTPS url, use correct protocol for referencing jQuery library as well.

The better approach would be to use "protocol-less" URL.
1//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
It looks strange and initially I also felt the same but "protocol-less" URL is the best way to reference third party content that’s available via both HTTP and HTTPS. When a URL’s protocol is omitted, the browser uses the underlying document’s protocol instead.

Thus, using the protocol-less URL allows a single script reference to adapt itself to what’s most optimal: HTTP and it’s full caching support on HTTP pages, and HTTPS on secured pages so that your users aren't confronted with a mixed content warning.

Source: jquerybyexample.blogspot.com/

Best jQuery Plugins 2013

Today we bring a list of latest jQuery plugins released in June 2013. These plugins are fresh, interesting, simple and lightweight. You may find them useful for your next project!!!
SMINT 

Smint is a simple jQuery plugin that helps with the navigation on one page style websites. It has 2 main elements, a sticky navigation bar that stays at the top of the page while you scroll down and menu buttons that automatically scroll the page to the section you clicked on.


CollagePlus

This plugin for jQuery will arrange your images to fit exactly within a container. You can define the padding between images, give the images css borders and define a target row height.


jQuery TourBus

Yet another jQuery tour/walkthrough plugin!


Jumble 

Jumble is a jQuery plugin that jumbles up the colours of your text - and can animate them.


Progression.js

Progression.js is a jQuery plugin that gives users real time hints & progress updates as they complete forms.


Hide/show password plugin

Hide/Show Password plugin lets you easily hide and reveal the contents of a password input field. It's based on a mobile design pattern.


Draggable Background

A jQuery plugin to make background images draggable.



Source: jquerybyexample.blogspot.com

jQuery code to strip/remove HTML tags

In this short post, find jQuery code to strip/remove HTML tags. To remove HTML tags, use text() function which returns only the text content and ignores the HTML portion.
1console.log($('#dvTest').text());
You can also strip/remove HTML tags from any variable as well as text() is jQuery function, so the variable needs to be converted into a jQuery object so that text() can be used.
1: var str = '<div>Sample <u>HTML</u> <b>Text</b> with <i>tags</i></div>';
2: console.log($(str).text());

Source : jquerybyexample.blogspot.com

3 Amazing jQuery Style Tutorials for Programmer

Every programmer knows that there are times when their knowledge of programming interferes with creativity, which limit their design perspectives. Some are even postponing or setting aside ideas because they feel that the project might be impossible to finish.  There are also times when programmers feel that they are being held back by the lack of good design plug-ins available. To solve these challenges, many designed different plug-ins to help web programmers and developers. These things can help revamp and enhance any sites or pages. This list will aid people of 10 of the most kick ass jQuery plug-ins they can use for future projects.

Particle Animation

The Particle Animation plugin is a great animation app which allows users to add great movements in their sites. It is also really easy to use unlike most animation programs currently available in the market today. This can definitely add spice to any site.

Rotating Image Slider

This plugin arranges images in a unique way through cool transitions. It rotates the images, and gives any site a posh and glamorous feel. This slider will definitely attract attention to any web page. Famous photography, culture and society pages use this amazing plug-in.

Adaptive Thumbnail Pile Effect with Automatic Grouping

This is a great tool for web sites with many images. The Adaptive Thumbnail Pile Effect groups the images and enhances it by adding animation once the image was clicked by a cursor. Those who are designing pages for kids and teenagers will find this plugin really helpful.
SOURCE: Smashinghub.com

Best jQuery Pagination Plugins

Pagination refers to dividing a large content into various different pages – as present in a book. Thus pagination is an extremely important part of any website as it allows presenting content in a more organized and easy to access way. Visitors find pages more desirable as they can quickly head directly to the page of their choice easily. Pagination can be achieved in various different ways, both manually and automatically. The most popular, easiest and widely used method is that of jQuery plugins. These plugins are easy to use and apply on your website and you don’t even need much coding knowledge for these.
Below we have collected for you a list of some of the most amazing and efficient 21 best jQuery Pagination Plugins. Huge amounts of this type of plugins are available out there, but not all of them are glitch-free and efficient. So you should definitely check the list given below out and take advantage of it as all the plugins in this list were especially handpicked for you all!

jPages

Demo || Download ]
jPages is a free jQuery plugin that works on client-side. It allows lot of features such as auto page turn, key and scroll browse, showing items with delay and customizable navigation panal.

Easy pagination with jQuery and Ajax

Demo || Download ]
Pagination is the process of chunking up your data into fixed sizes so that you only view one fixed size chunk at a time and can navigate easily backwards and forwards through other chunks.

jQuery Simple Content Sorting Plus Plugin

Demo || Download ]
Another premium jQuery content plugin that allows you to control your content with pagination!

WordPress Smart Pagination Plugin

Demo || Download ]
This plugin allows add custom pagination to your wordpress sites in minutes.

Smart Paginator

A Comprehensive jQuery Pagination plugin that makes adding pagination very simple task, all the navigation logic is built in and it is also very customizable.

jPaginator

Demo || Download ]
A Beautiful jPaginator CSS3 plugin provides lots of page links to improve the user experience of long pagination lists.

Websites Resources | Blogging | Technology News | Softwares - i Developments