web site project - JQuery Bookmarks Manager -
i'm working on basic jquery exercise codeacademy, , i'm trying create basic bookmark manager. problem text add actual bookmarks bar not contain link. somehow, link above text. here jquery code have.
$(document).ready(function() { // code here $('#add').click(function() { var toadd = $('input[name=site]').val(); var toadd2 = $('input[name=link]').val(); $('.websites ol').append("<li><a href="+ toadd2 + ">" + toadd + "</a></li>"); $('.websites').height("+=40px"); }); $('#remove').click(function() { $('.websites').effect('explode'); }); $(document).on('click', '.websites p', function(){ $(this).remove(); $('.websites').height("-=40px"); }); $('#fav').draggable(); $('ol').sortable(); }); <!doctype html> <html> <head> <link rel="stylesheet" href="style.css" /> <script type='text/javascript' src='script.js'></script> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script> <title>bookmarks manager</title> </head> <body> <div id="fav">bookmarks</div> <div class="websites"> <ol> <li><a href="http://www.celticsblog.com/">celticsblog</a></li> <li><a href="http://www.ign.com/">ign</a></li> <li><a href="http://www.cnn.com/">cnn</a></li> </ol> </div> <div id="form"><form> website name: <input type="text" name="site"/> </form> <form>address: <input type="text" name="link"/></form> <button id="add">add</button> <button id="remove">clear</button> </div> <p>to remove single item, click on website name. can organize bookmarks moving website names around. fun effect, click clear button!</p> </body>
Comments
Post a Comment