Forms Custom usage Fullscreen Example

Using elements inside existing forms (enhance switch only)

Password

City

State

Zip

Agree to terms and conditions

Skip enhancement of elements inside a mobiscroll form (skip the button)

Password

City

State

Zip

Agree to terms and conditions

Using form elements outside of forms (like a subscribe CTA)

Lorem ipsum dolor sit amet, similique expetendis suscipiantur no eos. Veniam officiis singulis usu id. Iriure animal vim ad, vix ex porro melius labitur, ea mentitum splendide laboramus pro. His vitae fabellas in, ad sed justo maiestatis. Te per quot brute civibus. Ei elit voluptatum usu. Fuisset necessitatibus eum cu, te deserunt omittantur nam.

Subscribe to our newsletter

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Customize & try demos locally

What framework are you using?

Javascript

jQuery

AngularJS

Angular

React

Other

Ionic Angular

Already have an account? Sign in here.

Install demo in your app

Follow this quick, two minute install guide

Close window

Step 1.Install the Mobiscroll CLI from npm

Copy command

$ npm install -g @mobiscroll/cli

The CLI makes configuring your apps super simple 👍

Step 2.Run the following command in the root folder of your Ionic project

Copy command

$ mobiscroll config ionic

You will be prompted to log in with your mobiscroll account. Set your password here

Create an Ionic 3 & Mobiscroll starter with the CLI:

$ mobiscroll start ionic myStarter

Run this command for Ionic 4 & Mobiscroll starter:

$ mobiscroll start ionic-angular myStarter

Step 3.Copy the code into your app.

Component
Template
CSS
Module
What to copy from Component

Copy TS

Copy HTML

Copy CSS

Copy Module

Step 4.Run ionic serve in the root folder of your app 🎉

Copy command

$ ionic serve

And voilà, everything should be running smoothly.

Install demo in your app

Follow this quick, two minute install guide

Close window

Step 1.Install the Mobiscroll CLI from npm

Copy command

$ npm install -g @mobiscroll/cli

The CLI makes configuring your apps super simple 👍

Step 2.Run the following command in the root folder of your Ionic project

Copy command

$ mobiscroll config ionic

You will be prompted to log in with your mobiscroll account. Set your password here

Run this command for Ionic 5 & React Mobiscroll starter:

$ mobiscroll start ionic-react myStarter

Step 3.Copy the code into your app.

Copy TSX

Copy CSS

Step 4.Run ionic serve in the root folder of your app 🎉

Copy command

$ ionic serve

And voilà, everything should be running smoothly.

Customize & try demos locally

How would you like to do it?

Install demo in your app

Follow this quick, two minute install guide

Close window

Step 1.Install the Mobiscroll CLI from npm

Copy command

$ npm install -g @mobiscroll/cli

The CLI makes configuring your apps super simple 👍

Step 2.Run the following command in the root folder of your Angular project

Copy command

$ mobiscroll config angular

You will be prompted to log in with your mobiscroll account. Set your password here

Step 3.Copy the code into your app. HTML goes into the markup, TS into Typescript.

Copy TS

Copy HTML

Copy CSS

Copy Module

Step 4.Run ng serve in the root folder of your app 🎉

Copy command

$ ng serve

And voilà, everything should be running smoothly.

Change your password

Need to update your password? Enter and hit the button below

Thanks for downloading

Customize demos locally

Everything is set up so that you can dig in right away and start exploring.

Please extract the zip file and simply open the demos in your favorite browser. For instructions on how to install Mobiscroll in your project follow this guide.

Let us know if we can help and enjoy! 👍

Thanks for downloading

Customize demos locally

Please extract the zip file and run the project like any Angular CLI app. Make sure to have the Angular CLI installed.

For installation and usage, extract the zip file and open a terminal window and follow these steps.

Step 1. Run in root folder

$ npm install

Step 2. Start the app

$ ng serve --open

Let us know if we can help and enjoy! 👍

Thanks for downloading

Customize demos locally

Everything is set up so that you can dig in right away and start exploring.

We have set up a trial so that you can try the demos locally.

The easiest way to get started is to follow the installation steps and by grabbing the code directly from the demo page. Let us know if we can help and enjoy! 👍

You'll find a fully functional Kitchen-sink Ionic app in the zip file.

Thanks for downloading

Customize demos locally

The demos are using Babel's in-browser ES6 and JSX transformer.

Please extract the zip file and open the demos in your browser.
For instructions on how to install Mobiscroll in your project follow this guide.

Let us know if we can help and enjoy!

Thanks for downloading

Try and customize the app locally

Extract the zip file and run the project like any Ionic app. Make sure to have Ionic CLI installed and open the terminal in the app root folder.

Step 1. Run in root folder

$ npm install

Step 2. Start the app

$ ionic serve

Let us know if we can help and enjoy!