still got no answer........... :( On Wednesday, May 11, 2016 at 5:13:21 PM UTC+8, Tridip Bhattacharjee wrote: > > long time back i developed a busy indicator by jquery and it works well. > we can show when i want and also can hide too. > > the same functionality i like to develop in angular without using jquery. > please have a look my fiddle https://jsfiddle.net/tridip/xvqbrse7/ and > run then can understand what i like to develop with angular. i am new in > angular and that is why no idea is coming to my mind that how could i > develop this what i developed with jquery. > > > *my code* > > > <input id = "btnShow" type="submit" value="Show"/><input id = "btnHide" > type="submit" value="Hide"/> > > $(document).ready(function() { > var loadImgPath = > "http://www.ajaxload.info/cache/FF/FF/FF/00/00/00/1-1.gif";; > > $("#btnShow").click(function(){ > $.busyToggle('BusyBox', loadImgPath, 0, 1, 500, 0, function () { > //alert('div visible'); > }); > return false; > }); > > $("#btnHide").click(function(){ > $.busyToggle('BusyBox', loadImgPath, -90, 0, 500, 0, function > () { > //alert('div hide') > }); > return false; > }); > }); > > //this exists routine will check the element exist on page > jQuery.fn.exists = function () { return this.length > 0; } > > //this exists busyToggle will show busy images at bottom center on page > $.busyToggle = function (selector, ImgLoadSrc, marginBottom, opacity, > speed, easing, callback) { > > var oDiv = $("<div id='" + selector + "'><img src='" + ImgLoadSrc + > "' alt='Loading...'/><div><em>Loading Wait...</em></div></div>"); > if ($("#BusyBox").exists() == false) { > oDiv.css("background", "-moz-linear-gradient(center top , #F1F2F2 > 0%, #F1F2F2 100%) repeat scroll 0 0 transparent"); > oDiv.css("border-top-left-radius", "5px"); > oDiv.css("border-top-right-radius", "5px"); > oDiv.css("bottom", "0px"); > oDiv.css("font-size", "0.8em"); > oDiv.css("font-style", "normal"); > oDiv.css("font-weight", "normal"); > oDiv.css("left", "50%"); > oDiv.css("margin-left", "-45px"); > oDiv.css("padding-top", "20px"); > oDiv.css("position", "fixed"); > oDiv.css("text-align", "center"); > oDiv.css("width", "90px"); > oDiv.css("height", "50px"); > oDiv.css("background-repeat", "no-repeat"); > oDiv.css("background-position", "center center"); > oDiv.css("border", "1px solid #ccc"); > oDiv.css("margin-bottom", "-(90px"); > oDiv.data('IsUp', 1) > oDiv.appendTo('body'); > } > > if (oDiv.data('IsUp') == 1) { > oDiv.data('IsUp', 0); > return $("#BusyBox").stop(true).animate({ marginBottom: > marginBottom, opacity: opacity }, { queue: false, duration: speed, complete: > callback }); > } > else { > oDiv.data('IsUp', 1); > return $("#BusyBox").stop(true).animate({ marginBottom: > marginBottom, opacity: opacity }, { queue: false, duration: speed, complete: > callback }); > } > }; > > if possible please see my above jquery code and guide me how to develop > same output with angular. thanks >
-- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
![http://www.ajaxload.info/cache/FF/FF/FF/00/00/00/1-1.gif"](http://www.ajaxload.info/cache/FF/FF/FF/00/00/00/1-1.gif"){kind=link}