Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Changes select menus to unordered lists so they can be styled better.
JavaScript
branch: master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
demo
lib
README.md
jquery.smooth-scroll-select-menu.js

README.md

Smooth Scroll Select Menu

This plugin was created in order to style select tags with extremely large amounts of options.

Features

  • Changes select and option tags to a ul with lis tied to a hidden input.
  • Scrolls page down to the top of select to allow the greatest number of options to show on page.
  • Adds scroll lis to the top and bottom of the list if the list is too big for the page.
  • Includes click to scroll and hover to scroll behaviors. Hover is the default.
  • Allows hover to scroll time to be adjusted.
  • Supports after select and after open callbacks.
  • Select classes and Id are transferred to new div wrapper.
  • Degrades gracefully when javascript is disabled.

Usage

Hover to scroll example:

    $('select.classToChange').jq_smoothScrollSelect({
        scrollTime: 200,
        afterSelect: function(clicked_li){
            alert('You selected ' + clicked_li.html() + '!');
        },
        afterOpen: function(selectWrap){
            //alert('Open!');
        }
    });

Click to scroll example:

    $('select.classToChange').jq_smoothScrollSelect({
        scrollEvent: 'click'
    });

Demo

http://brentw.github.com/2011/03/06/smooth-scroll-select-menu-jquery-plugin.html

Requirements

Thank You

Something went wrong with that request. Please try again.