Splitting.js, creates elements and adds CSS variables for split words & chars!
Splitting UI module - Example
Splitting UI module - Settings
Splitting UI module - Selectors List

This module integrates the Splitting.js library allows you to creates elements and adds CSS Variables for split words & characters! (lines, items, grids, images, more!).

Split text to unlock amazing possibilities for style and animating text, grids, and more!.

Features

  • Splitting.js is a JavaScript microlibrary designed to split (section off) an element in a variety of ways, such as words, characters, child nodes, and more!
  • Most Splitting methods utilize a series of s populated with CSS variables and data attributes unlocking transitions and animations that were previously not feasible with CSS.
  • This module allows for integration of Splitting.js into Drupal and load Splitting library on every pages. You need to call Splitting() in your theme Javascript file.
  • Splitting UI sub module is User interface for using Splitting.js if you are no familiar with programming.

Usage

Enable Splitting UI sub-module. Go to "admin/config/user-interface/splitting" to add CSS selectors and manage few global options.

Installation

Please view the project's README.txt for detailed installation instruction.

Download Splitting.js Library Latest Version from Github.

  • Textimate ( Text + Animate )
    Provides text animation, enhancing site interactivity with awesome effects. Effortlessly transform static text into mesmerizing animations.
  • Animate.css
    Allows you to makes cross-browser animations for use in your web projects. Great for emphasis, home pages, sliders, blocks with cool animation effects.

Support

Please let me know if a new feature is needed or is there any issue and feedback. You can announce it in the Splitting Issues section.

Also, if you are interested in developing and fixing the problems of this module, let me know.

Project information

Releases