{"id":81,"date":"2012-10-05T14:01:29","date_gmt":"2012-10-05T18:01:29","guid":{"rendered":"https:\/\/havalite.com\/?p=81"},"modified":"2022-11-22T14:37:05","modified_gmt":"2022-11-22T19:37:05","slug":"jmotion-jquery-plugin","status":"publish","type":"post","link":"https:\/\/havalite.com\/?p=81","title":{"rendered":"jmotion – jQuery plugin"},"content":{"rendered":"

JMotion 1.0.2 <\/strong>is a simple jQuery plugin for animating a sequence of images which saved in a folder. The result shows a Gif-like animations or a Banner rotator.<\/p>\n

JMotion <\/strong>works with all versions of jQuery from 1.4. to 1.8<\/p>\n

Options:<\/h3>\n
folder \/\/ the url path of the folder where images exist\t\r\ntype \/\/ gif, jpg, png, bmp etc...\r\namount \/\/ how many images? \r\npref \/\/ if images have prefix such as jm_0, jm_1, jm_2 etc.. \r\nfade \/\/ fading speed from image to another \r\nspeed \/\/ how long should a single image stays\r\nwidth \/\/ width of the image\r\nheight \/\/ height of the image\r\nfloat \/\/if content after image is float: left, right, center\r\neffect \/\/ try one of the shown effects in demo\r\n<\/pre>\n
Usage:<\/h3>\n
There are 2 ways of using jmotion:<\/p>\n
1. Javascript:<\/strong><\/p>\n
<script language=\"javascript\" src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.4.2\/jquery.min.js\"><\/script>\r\n<script language=\"javascript\" src=\"jmotion.js\"><\/script>\r\n\r\n   $('#motion').jmotion({ \r\n\tfolder:'img',\r\n\tamount:9,\r\n\twidth:250,\r\n\theight:250,\r\n\tspeed:90,\r\n\tfade:0,\r\n\tfloat:'left' \r\n   });\r\n<\/script>\r\n\r\n\/\/ the container\r\n<div id=\"motion\"><img border=\"0\" src=\"img\/preloader.gif\" \/><\/div>\r\n\r\n<\/pre>\n
2. or pure XHTML by adding jmotion-ex.js in the head part and use class=”jmotion” in your div tag:<\/strong><\/p>\n
<script language=\"javascript\" src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.4.2\/jquery.min.js\"><\/script>\r\n<script language=\"javascript\" src=\"jmotion.js\"><\/script>\r\n<script language=\"javascript\" src=\"jmotion-ex.js\"><\/script>\r\n\r\n\/\/ the container\r\n<div class=\"jmotion\" folder=\"img\" pref=\"im_\" width=\"200\" height=\"200\" speed=\"90\" float=\"left\"><\/div>\r\n\r\n<\/pre>\n
 <\/p>\n
See Demo<\/big><\/a><\/span>\u00a0\u00a0\u00a0 \u00a0 \u00a0 \u00a0 Download: jmotion.zip<\/a><\/big><\/span><\/p>\n","protected":false},"excerpt":{"rendered":"
JMotion 1.0.2 is a simple jQuery plugin for animating a sequence of images which saved in a folder. The result shows a Gif-like animations or a Banner rotator. JMotion works with all versions of jQuery from 1.4. to 1.8 Options: folder \/\/ the url path of the folder where images exist type \/\/ gif, jpg, […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[13,11,9,16,10,12,17,18,19,7,8,15,14],"class_list":["post-81","post","type-post","status-publish","format-standard","hentry","category-jquery-plugins","tag-animated-banner","tag-animation","tag-download","tag-effect","tag-free","tag-gif","tag-html5","tag-image","tag-img","tag-jquery","tag-plugins","tag-rotation","tag-rotator"],"_links":{"self":[{"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts\/81","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=81"}],"version-history":[{"count":1,"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts\/81\/revisions"}],"predecessor-version":[{"id":82,"href":"https:\/\/havalite.com\/index.php?rest_route=\/wp\/v2\/posts\/81\/revisions\/82"}],"wp:attachment":[{"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=81"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=81"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/havalite.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=81"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}