Installing FullCalendar | drupal.org Last updated May 24, 2012. Created by aspilicious on February 9, 2011.Edited by emmajane, sirtet, jhodgdon, tim.plunkett. Log in to edit this page. Requirements Drupal 7 Drupal 6 Views (For Views 3 use FullCalendar 6.x-2.x)Date (6.x-2.7 or later)jQuery Update 6.x-2.x (jQuery 1.3.x)jQuery UI (jQuery UI 1.7.x)FullCalendar (external JS Library) cck is not strictly a requirement, but is generally used to create custom node types. Installing the module Download a version of FullCalendar.Unzip the module.Move the module into the sites/all/modules/ directory. Installing the plugin Download the most recent version of the plugin.Unzip the plugin.Move the plugin into the sites/all/libraries/ directory. Note: When unzipped, the plugin contains several directories. If you are using drush, enable the fullcalendar module and then use the command: drush fullcalendar-plugin to download the correct version of the plugin and move the files accordingly. Looking for support?
jQuery Datepicker A datepicker can easily be added as a popup to a text field or inline in a division or span with appropriate default settings. The popup shows when the field gains focus and is closed by clicking on the Close link or clicking anywhere else on the page. You can also remove the datepicker widget if it is no longer required. Popup datepicker (input): Inline datepicker (div/span): The default settings are: Datepicker appears on focus (popup only) Datepicker appears below the input field (unless there is not enough room there) Text is in US English Date format is mm/dd/yyyy Month and year are selectable directly 10 years before and after the current year are shown in the year drop-down Show a single month Select a single date Week starts on Sunday Days in other months are not displayed No date restrictions Clicking elsewhere closes the date picker (popup only) You can set defaults that apply to all datepicker instances as shown below: Focus and button: From a button only: From an image only: Show :
5 Tips for More Efficient jQuery Selectors As the name implies, jQuery focuses on queries. The core of the library allows you to find DOM elements using CSS selector syntax and run methods on that collection. jQuery uses native browser API methods to retrieve DOM collections. Newer browsers support getElementsByClassName, querySelector and querySelectorAll which parses CSS syntax. However, older browsers only offer getElementById and getElementByTagName. In the worst scenarios, jQuery’s Sizzle engine must parse the selector string and hunt for matching elements. Here are five tips which could help you optimize your jQuery selectors… 1. HTML ID attributes are unique in every page and even older browsers can locate a single element very quickly: $("#myelement"); 2. The following class selector will run quickly in modern browsers: $(".myclass"); Unfortunately, in older browser such as IE6/7 and Firefox 2, jQuery must examine every element on the page to determine whether “myclass” has been applied. $("div.myclass"); 3. $("p#intro em"); 4.
.delay() Description: Set a timer to delay execution of subsequent items in the queue. Added to jQuery in version 1.4, the .delay() method allows us to delay the execution of functions that follow it in the queue. It can be used with the standard effects queue or with a custom queue. Only subsequent events in a queue are delayed; for example this will not delay the no-arguments forms of .show() or .hide() which do not use the effects queue. Durations are given in milliseconds; higher values indicate slower animations, not faster ones. Using the standard effects queue, we can, for example, set an 800-millisecond delay between the .slideUp() and .fadeIn() of <div id="foo">: When this statement is executed, the element slides up for 300 milliseconds and then pauses for 800 milliseconds before fading in for 400 milliseconds. The .delay() method is best for delaying between queued jQuery effects.
Nivo Slider - The Most Awesome jQuery Image Slider Beautiful transition effects Nivo Slider offers 16 transition effects ranging from slicing and sliding, to fading and folding, making your galleries interactive and fun. No coding skills needed Create a beautiful experience when playing your gallery of images without any advanced coding. Include the image slider in your posts and pages using a simple shortcode. Automatic image cropping Nivo Slider crops and resizes images to a specified size, so you don’t have to do it manually for each image. Responsive and mobile ready The generated image sliders are completely responsive. Everyone loves Nivo! Time to make the best of your website’s’ image galleries. Pre-built slider themes You can choose the style of your sliders from the awesome pre-built themes. Create sliders from categories or galleries Besides the classic image sliders, Nivo allows you to choose between Category and Gallery sliders. Post types support Create carousels Join 471,039 happy customers and get access to 30+ premium products
css selectors - JQuery - One handler for multiple elements using variables