Sliding Panels

So you like the way iPad and iPhone work? Having great bouncing scrollable areas, minimalistic scrollbars, amazing sliding pages? Great gestures touch interfaces and stunning styles? Well you can have all that now on your regular browsers as well as touch devices with the new Sliding Panels extension from DMXzone!

Based on CSS and jQuery – fully cross browser, this extension offers support for native gestures on touch devices as well mouse gestures on regular browsers! Now you can scroll by swiping with your mouse on your browser or finger when using an iPad, iPhone or other touch device!

Divide your content in great looking pages that can be naturally slided left or right, with cool navigation and displayed in 15 styles! Every content page is fully visually editable in Dreamweaver so you can put any content in it! 

$50.00
- OR -
Features

Features in Detail

  • 15 stylish CSS Designs Included - Various styles to fit your web site perfectly
    • Lightweight CSS3 Designs - We have chosen to use CSS3 effects like rounded corners and shadows in our CSS designs to make them really pure CSS and very light - so no extra images for many weird css hacks are loaded

  • Amazing Sideward Scrolling Effect - You can scroll by swiping with your mouse on your browser or finger touch and swipe when using an iPad, iPhone or other touch device.

  • Full Support for Gestures and Page Scrolling - You can turn on/off the bouncing scrollable areas and the gestures that allow you to scroll by swiping with your mouse on your browser or finger when using an iPad, iPhone or other touch device

  • Scrollbar appearance - Integrated fancy on demand scrollbar for each Sliding Panels design.


  • Customizable animation - Adjust the Panels appearance by speed, deceleration and interval.

  • Organize in Panels - Divide your content for a better preview
    • Multiple Panels - Divide your content in multiple panels and have a great tabs/menu like navigation between the sections

  • Side Navigation buttons - You can also choose if you want to have side navigation arrow buttons, where should they be positioned top, bottom and on both sides.

  • Auto Paginating - Quick access to all the pages in the Sliding Panels

  • Show any content – You can preview any kind of content in your Sliding Panels, such as text, images and videos, even a whole web page.

  • Pure CSS Panels - Doesn't require any plugins and works on all modern browsers

  • Search Engine Friendly - as the Sliding Panels is pure HTML and CSS code it can be nicely indexed by all search engines and web spiders

  • Revolutional Dreamweaver integration! All the panels are live rendered in Dreamweaver and can be fully navigated in design view! So you can easily visual switch from panel to panel and edit it right in place! Note this feature requires Dreamweaver CS3+


  • Fully customizable - Don't like to supply styles? Well it is all CSS based so you can easily make your own adjustments in the CSS from within Dreamweaver's CSS editor

  • Fully Controllable by behaviors - You want to navigate to specific position, start or stop the Panel - it can be easily done with the Control Sliding Panels behavior.

  • Need auto sliding – Well,  just do set the Auto Play - and then the user will navigate manually only

  • Full support for keyboard and mouse wheel navigation (optional)

  • Inline property inspector - You can easily change visual options later on.

 

Showcases


Videos

Basic Usage

Controlling the Sliding Panels Navigation

With this movie we will show you how to control the Sliding Panels navigation with Dreamweaver Behaviors..

Creating Simple Sliding Panels

With this movie we will show you the basic features and how to create simple Sliding Panels.

Creating Dynamic Sliding Panels

With this movie we will show you how to create Sliding Panels that retrieve their content from a database using standard Dreamweaver Recordset and Repeat Regions.

Bundle Usage

Inserting a CSS Image Gallery within Sliding Panels

With this movie we will show you how to insert CSS Image Gallery within the Sliding Panels.


HTML5 Slideshow Video

Navigate the Sliding Panels with HTML5 Slideshow

With this movie Brian Wood will show you how to navigate your Sliding Panels with HTML5 Slideshow and display info.
  • Creating a Sliding Video Player
    – A step by step video tutorial on creating a sliding video player
  • Navigate Sliding Panels with HTML5 Slideshow
    – Use the behavior connector to navigate the panels
  • Creating a Fullscreen iPad Gallery with Animated Thumbnails
    – Navigate your gallery with the animated image thumbnails
Requirements
Type: Behavior
License: External link
Product: Dreamweaver 8, Dreamweaver CS3, Dreamweaver CS4, Dreamweaver CS5/CS5.5 and CS6, Dreamweaver CC
Platform: Win XP/2000/2003/2008/7, Mac OS X
Browser: IE 6, Opera 7, Opera 8, Opera 9, Safari 2.0, IE 7, Opera 9.5, Safari 3, Chrome 9+, IE 8, Safari 4+, Opera 10+, iPad, Firefox 4+


History

Version 1.0.10

  • Included the latest jQuery 1.11.1
  • Improved for Dreamweaver CC 2014
  • Improved for DMXzone Extension Manager

Version 1.0.9

  • Full Dreamweaver CC and Extension Manager CC support
  • Included new Behavior Connector with restyled UI and better Mac OSX Support
  • Updated the automatic file copy and update component for better Dreamweaver CC support
  • Improved compatibility with the latest jQuery
  • Included latest jQuery 1.10.1
  • Improved Windows 8 compatibility

Version 1.0.8

  • Now the iPhone and iPad designs are fully responsive! When the navigation bar does not fit, it can be scrolled with gestures! Also on arrow navigation the current selection is updated and the navigation bar automatically scrolls if needed.
  • Improved Form handling in Sliding Panels
  • Improved Dreamweaver CS6 compatibility
  • Improved installer for Dreamweaver CS 6.1 (Adobe Creative Cloud) compatibility

Version 1.0.7

  • Improved integration with dynamic data
  • Improved DW integration
  • Included the latest mouse wheel plug-in
  • Latest jQuery 1.7.2 included
  • Improved installer for DW CS 5.5+

Version 1.0.6

  • Improved compatibility with newest jQuery 1.6+ versions
  • Improved mouse wheel handling for the newest jQuery
  • Included latest jQuery 1.6.3
  • Optimized source and files for smaller size
  • Improved automatic shared file copy, synchronization and upload from Dreamweaver
  • Improved working in Dreamweaver templates

Version 1.0.5

  • Improved compatibility with newest jQuery versions
  • Smaller JavaScript files by better compression
  • Improved jQuery version recognition and include
  • Improved related files include method
  • Compatibility now with site root relative links Dreamweaver option for making all includes site root relative

Version 1.0.4

  • Included new jQuery 1.4.4
  • Improved depended file includes
  • Improved includes and cleanup of styles
  • Fixed scrollTo for anchors

Version 1.0.3

  • Allow dragging on images when sliding on regular browsers, even if images have links
  • Fixed click events within the panels
  • Improved compatibility with Animated Thumbnail gallery
  • Smart linking to case sensitive styles folder

Version 1.0.2

  • Improved working in Dreamweaver templates
  • Improved links working inside the panels when used on iPhone and iPad

Version 1.0.1

  • Focus improved on form fields within the panels
  • Behavior icon changes now when behaviors are selected

Update Procedure:

Just open a page using the Sliding Panels. You will see a progress bar indicating new files are being copied. After that a dialog will popup with the list of the new files. Depending on if you have remote site defined and you have site synchronization enabled, the files will be automatically synchronized or you will be presented an option to upload all files.

George Petrov

George PetrovGeorge Petrov is a renowned software writer and developer whose extensive skills brought numerous extensions, articles and knowledge to the DMXzone- the online community for professional Adobe Dreamweaver users. His expertise in countless languages and technologies gives inspiration and teach valuable lessons on his website – DMXzone.com which is most popular for its over high-quality Dreamweaver extensions and templates.

See All Postings From George Petrov >>

Place your review about Sliding Panels




You must me logged in to write a review
Reviews
excellent tool and easy to deploy
June 17, 2010 by Mikel Bullis

Within minutes we had the sliding panels working within our website template. The Sliding Panels Dreamweaver interface is intuitive and offers great flexibility. For beginners its plugin and upload, for advanced users, complete access to CSS for customization. Very happy with the tool and DMXZONE!