Lightweight jQuery Shopping List App

File Size: 6.15 KB
Views Total: 4368
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Lightweight jQuery Shopping List App

Shopping-List is a lightweight jQuery plugin to create an interactive shopping list on the web page. Add the items you need. Check them off once you've got them, and delete them when you're done.

See also:

How to use it:

1. Include the latest version of jQuery javascript library from a CDN.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

2. Include the jQuery shopping-list plugin's files in the page.

<link rel="stylesheet" type="text/css" href="shoppinglist.css"/>
<script type="text/javascript" src="shop.js"></script>

3. Build a shopping list web app following the Html structure.

<div id="main">
<div id="top">
<div id="form">
<input type="text" id="newItem" placeholder="enter your items">
<input type="submit" id="addItem" value="+">
</div>
<div class="line"> </div>
</div>
</div>

<div id="bottom">
<div class="items">
<ul id="itemList">
</ul>
</div>
</div>

This awesome jQuery plugin is developed by emilytankersley. For more Advanced Usages, please check the demo page or visit the official website.