Skip to content

Fix markdown format to help people read #21

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
extend1994 wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Fix markdown format to help people read #21

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,18 @@ Checkout the demo [here](http://ahmedrad.github.io/sliiide/).

First things first, this plugin is currently in Beta, please feel free to take if for a test ride into the wild and send back any feedback or bugs you might encounter. I created this plugin out of frustration with all the slider jQuery plugins out there that just weren’t doing it for me. Enjoy :)

##What to use this for?
## What to use this for?
You have a div (probably a nav menu or a side bar) that you want to animate with a sliding effect from outside the viewport to inside the viewport. You want to have complete control over the distance this div slides but you don’t want to worry about how to position it or how to stretch it to match the screen’s dimensions. You also don’t wanna bother with how the animation affects the rest of the page, how to deal with scrolling and the logic behind activating and deactivating the menu.

##Any Dependencies?
## Any Dependencies?
The plugin is built on jQuery 2.1.0 but could potentially work with older and newer versions, give it a shot and let me know how it goes if you run into any problems. Otherwise, there’s no CSS file or anything else needed. This plugin manipulates inline styles for the element you're using as a slide menu and some manipulation to the body element. If you're also doing a lot of inline style manipulation you might run into conflicts.

####this plugin officially supports chrome, firefox, safari, IE 10/11 and Edge
**this plugin officially supports chrome, firefox, safari, IE 10/11 and Edge**

##How to use it?
1- Download the sliiide js file (or the minified version) from the github repo, include the js file before the body end tag and make sure jQuery is included before it. Or just use bower "bower install sliiide"
## How to use it?
1. Download the sliiide js file (or the minified version) from the github repo, include the js file before the body end tag and make sure jQuery is included before it. Or just use bower "bower install sliiide"

2- you’ll need a div (a nav menu or whatever you have in mind) and set its visibility to hidden. PLEASE MAKE SURE THIS DIV IS A DIRECT CHILD OF THE BODY ELEMENT. You also need a settings object.
2. you’ll need a div (a nav menu or whatever you have in mind) and set its visibility to hidden. PLEASE MAKE SURE THIS DIV IS A DIRECT CHILD OF THE BODY ELEMENT. You also need a settings object.
```
var settings = {
toggle: "#sliiider-toggle", // the selector for the menu toggle, whatever clickable element you want to activate or deactivate the menu. A click listener will be added to this element.
Expand All @@ -28,9 +28,9 @@ The plugin is built on jQuery 2.1.0 but could potentially work with older and ne

$(‘#menu’).sliiide(settings); //initialize sliiide
```
3- If you’re going to slide that div horizontally (from the right or left) then you need to style the width of the div yourself and sliiide will stretch the height for you to full window height. If you’re going to slide it vertically (from the top or the bottom) then you need to style the height and sliiide will stretch the width for you. the sliding effect will change to match whatever styling you added to the width (or height) of the element.
3. If you’re going to slide that div horizontally (from the right or left) then you need to style the width of the div yourself and sliiide will stretch the height for you to full window height. If you’re going to slide it vertically (from the top or the bottom) then you need to style the height and sliiide will stretch the width for you. the sliding effect will change to match whatever styling you added to the width (or height) of the element.

4- useful functions available for you:
4. useful functions available for you:
```
var menu = $('.left-menu').sliiide({place: 'left', exit_selector: '.some-exit-selector', toggle: '#some-toggle-selector, no_scroll: true, body_slide: true'});

Expand Down