Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
A jQuery Plugin for adding Browser Pinned Site Capabilities to Web Sites
JavaScript
branch: master

readme typo

latest commit 97447f31e9
Brandon Satrom authored
Failed to load latest commit information.
build Completed CoffeeScript migration, full suite of unit tests and window…
css moving from hg to git. Initial commit
images moving from hg to git. Initial commit
js
lib bumped to jQuery 1.7.1
package added release and updated readme
releases moving from hg to git. Initial commit
sample bumped to jQuery 1.7.1
tests bumped to jQuery 1.7.1
.gitignore removed coffee directory
license.md moving from hg to git. Added Apache License file.
pinifySmall.ico moving from hg to git. Initial commit
readme.md readme typo

readme.md

jQuery.pinify

Contributors: Brandon Satrom, Clark Sell

Tags: jquery, ie9, pinning

A jQuery Plugin for adding Site Pinning features to your websites.

Prerequisites

Description

A jQuery Plugin for adding IE9 features (site pinning, site mode, etc.) to your websites. Several new features of Internet Explorer 9 are designed to enhance the browsing experience of consumers by enabling sites that leverage certain features to behave like applications on the desktop when those sites are "pinned" to the taskbar in Windows 7. A user pins a site by dragging the site's tab (or favicon in the address bar) to the taskbar. For all sites, IE9 will create a default experience (called "site mode") that will use information about the site to create an instance of the browser customized to look specific to that site. Developers can also add specific meta tags and script commands to extend these features to further customize user's pinned experience of the site.

The purpose of the pinify jQuery plugin is to enable developers to safely leverage IE9 side mode features with simple commands and no need for additional browser checks. To view the full documentation, click here, or on the Documentation tab above. For more information about site pinning, and for a whirlwind walkthrough of pinify, check out Brandon Satrom's blog post "Applify Your Sites with Pinned Site and ie9ify, the IE9 jQuery Plugin."

To install the pinify plugin, use NuGet or download the source directly from here or from plugins.jquery.com.

Note: NuGet package will be changed from jquery.ie9ify to jquery.pinify in the near future.

To view a screencast covering ALL aspects of the pinify Plugin, click here.

Installation

This section describes how to install the plugin and get it working.

Vanilla Install

  1. Place jquery.pinify.js (or jquery.pinify.min.js) in your scripts folder
  2. Place jquery.pinify.css (or jquery.pinify.min.css) in your CSS folder
  3. Add references to the JS and CSS file in your page, similar to:

    <link rel="stylesheet" type="text/css" media="screen" href="/css/jquery.pinify.min.css" />
    <script type="text/javascript" src="/js/jquery-1.6.min.js"></script>
    <script type="text/javascript" src="/js/jquery.pinify.js"></script>     
    
  4. In a script block call $('head').pinify();

  5. Run your site in IE9, drag it to the taskbar and watch it pin!

For more information and additonal documentation, see the Wiki pages at this site

Using NuGet in Visual Studio

  1. In the Package Manager Console, type install-package jquery.ie9ify

  2. In a script block call $('head').pinify();

  3. Run your site in IE9, drag it to the taskbar and watch it pin!

For more information and additonal documentation, see the Wiki pages at this site

Changelog

1.3

  • Removed CoffeeScript source (yeah, we did.)
  • Bumped to jQuery 1.7.1
  • Roll-up of previous patches, including:
    • Issue #8 - dynamic path for icon (thanks, foxp2!)
    • Issue #7 - fixed error type (thanks, foxp2!)
    • Issue #6 - Added window.target (thanks, foxp2!)
    • Issue #4 - Second logo missing on brandedTopHat teaser (thanks, garjitech!)
    • Issue #1 - Typo fix (thanks, nakajima!)

1.2.5

  • Migrated source to CoffeeScript
  • Removed redundant js and css files from tests and sample directories
  • Completed full suite of qUnit tests for current functionality
  • Minor bug fixes related to funcitonality previously not under test

1.2

  • [MAJOR BREAKING CHANGE] Changed name of plugin from ie9ify to pinify. Script/Style references and calls to the plugin should be updated accordingly:

    jquery.ie9ify.js ==> jquery.pinify.js
    jquery.ie9ify.css ==> jquery.pinify.css
    $(*).ie9ify(); ==> $(*).pinify();
    

1.1

  • [BREAKING CHANGE] Added .css stylesheet for calls to pinTeaser() and removed inline styles from that method.
  • Modified all for loops to use jquery $.each
  • Modified Site Mode feature detection to be more reliable and not browser-version specific
  • Modified ready handler in sample and qunit tests
  • Upgraded to jQuery 1.5.2
  • Created build PowerShell script to auto-minify jquery.ie9ify.js (using yuicompressor) and move to the sample/js and root js folders.
  • Completed build, package and push scripts to: 1)auto-version and timestamp the ie9ify js file, 2) minify .js and .css, 3) create a zip archive for Codeplex releases, 4) create a NuGet package and 5) deploy the package to NuGet.org
  • Added fadeIn for pinTeaser element, and created options to hide the teaser after an interval, and set the timeout length
  • Implemented Thumbbar buttons style support in $.ie9ify.createThumbbarButtons() through a new property called alternateStyle. Modified sample to include example of thumbbar buttons with alternate styling.
  • [BREAKING CHANGE] Deprecated the mainContentSelector option in pinTeaser. Use the topHat teaser type if you need to move your page down to fit in a teaser
  • [BREAKING CHANGE] Moved pinTeaser options linkText, linkColor, backgroundColor and textColor into a container "style" option. You can now use style: { linkText: ... }
  • Added 3 additional pinTeaser type options 'topHat,' 'brandedTopHat,' and 'doubleTopHat.' Default is 'hangingChad' and is accesible via the 'type' option in the call to pinTeaser. These new types require the .css stylesheet introduced in this version and images contained in the 'images' directory.
Something went wrong with that request. Please try again.