1LD Tutorials & Blogs

Tutorials

Setup

Step 1: In Parallax Switch’s “General Controls” section select a the number of items you would like to switch between using the “# of Items” option. Typically you will want to select 2 or 3 items, anything higher is for the “Play Items as Frames” Option (this is described under the “Auto Play” heading below).

Step 2: Select a “Position” option.

Step 2a Relative: “Relative” will place the Stack’s content where ever you have placed it, just as you would expect with any other stack you place into your editor.

Step 2b Fixed: “Fixed” means that the stack will not scroll with the page and will instead always be visible in the window. Selecting “Fixed” as an option will add width, height, horizontal position, and vertical position options. The Auto Height and Auto Width are enabled by default. These options match the height and width of the content placed inside of Parallax Switch. If you disable these options you can use the width and height sliders to declare percentage based values. Then all you need to do is adjust the horizontal and vertical positions. The horizontal position is adjusted in a percentage value while the vertical position is set by a pixel value. Change to preview mode to see where your stack sits in the window as these options do not display in edit mode.

Step 3: You now need to assign distance values to each item (Found in the Stack’s area not the Options menu). The first item will automatically display on page load or start. The following items will need to be set in descending pixel values. The “Display at Distance” values will determine when that particular item will display. Setting an item to 400 will make it so that item displays when the top of the browser window is 400px from Parallax Switch (when scrolling).

Example Setup Values:
Item #1: Start (cannot be changed)
Item #2: 500px (will display this item when Parallax Switch is 500px from the top of the browser window)
Item #3: 100px (will display this item when Parallax Switch is 100px from the top of the browser window)
Item #4: -300px (will display this item when the top of the window has scrolled past Parallax Switch by 300px )

Step 4: In Parallax Switch’s “General Controls” section select an “Animation” option. By default Parallax Switch will fade between each item. You can then adjust the speed of each animation’s transition using the “Speed” Slider. Preview your changes and adjust till you get a good fit for your site.

Auto Play

Play Items as Frames: Auto Play, simply put, simulates a GIF. It will automatically cycle through each item in Parallax Shift like frames in a movie. This mode does not support the “Animation” option.

Speed: This is the amount of time that each individual frame will be displayed in milliseconds. So if it’s set to 0, it will cycle through each item very fast, but the higher the number, the slower it will cycle through the items in Parallax Switch.

Help

Display Scroll Position This option displays the position in pixels of how far the top of the window is to the top of the Parallax Switch stack. This will help you set up your “Display at Distance” values.

RapidWeaver Stack Tutorials

RapidWeaver Theme Tutorials

RapidWeaver Project Documentation

Tutorials and documentation for all 1LD Project files can be found at the link below.

See Documentation

Get the power of a framework, for the price of a theme, in the convenience of a prebuilt RapidWeaver project file

Blog

Super Forms 2 – 1.2.0 Update

Through customer feedback, we were able to add some new features and fix a few bugs with our Super Forms 2 stack. Check out the list of changes below. This update is free for those who own the Super Forms 2 stack. 

Super Forms 2 (Version 1.2.0)

  • NEW: You can now customize each field’s Required/Invalid input message
  • NEW: Customize checkbox true and false values (“Yes” and “No”)
  • NEW: Customize file upload error messages
  • NEW: reCAPTCHA now has an option to support non SSL (http) websites
  • NEW: Support for v2 invisible reCAPTCHA
  • NEW: Support for v3 reCAPTCHA
  • NEW: Set a specific locale/language for reCAPTCHA
  • NEW: Allow the form to submit to Google Sheets and an email address at the same time
  • NEW: Optionally customize the name of each field for Google Spreadsheets and the titles as shown in the sent message
  • Improved: Prevents notices for empty form fields from displaying in PHP logs
  • Improved: Date timezone defaults to UTC in case the server does not have a default defined timezone
  • Fixed: Bug that could stop attachments from being sent properly
  • Fixed: File upload field was rejecting files if the extensions had capital letters
  • Fixed: Bug that could cause attachments to arrive with 0kb file sizes
  • Fixed: Multi select now properly concats selected options
  • Fixed: Checkbox display bug in iOS Safari
  • Other minor bug fixes 

Check it out!

Latest News

Newsletter

Join our newsletter to get notified of new releases, updates, and discounts.

Subscribe

Popular Links

Free Stacks & Themes
See Order History
Product Tutorials
FAQs

© 2011 One Little Designer, 1 Little Designer (1LD)

RapidWeaver is a trademark of Realmac Software