Portamento js
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Portamento js

on

  • 290 views

 

Statistics

Views

Total Views
290
Views on SlideShare
275
Embed Views
15

Actions

Likes
0
Downloads
0
Comments
0

1 Embed 15

http://www.slideee.com 15

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Portamento js Presentation Transcript

  • 1. Portamento.js Jason
  • 2. Portamento.js  Portamento is a jQuery plugin that makes it simple to add sliding panel functionality to your web page.  Aka "floating“.  All that's needed is some simple CSS and one line of JavaScript, and you're away.
  • 3. Usage Setp1  Include portamento.js in your page, just before </body> <script src="portamento.js"></script>
  • 4. Usage Setp2  In your JavaScript, apply the plugin to the element you want to slide - in this case #example $('#example').portamento();
  • 5. Portamento.js  CSS. #portamento_container { float:right; position:relative; } #portamento_container #example { float:none; position:absolute; } #portamento_container #example.fixed { position:fixed; }
  • 6. Portamento.js  Options  wrapper - The sliding panel won't go out of its wrapper's boundaries, and respects the wrapper's padding. (Default wrapper <body>)  gap - The number of pixels to leave between the top of the viewport and the top of the sliding panel. (default value is 10 px)  disableWorkaround - Disable the workaround for not-quite capable browsers