aamirafridi.com
Very useful Javascript and jQuery code snippets musings of Aamir Afridi
http://aamirafridi.com/jquery/jsjquery-code-snippets
Musings of Aamir Afridi. Some common Javascript snippets I use in my projects. If you got something useful, please share in comments section. Check if element has scrollbar. I was working on a project where I need to add jQuery UI resizable to a list but I have to check if it has a scrollbar. I endup with a tiny jQuery plugin. Function($) { $.fn.hasScrollBar = function() { return this.get(0).scrollHeight this.height(); } })(jQuery);. Div style="height:200px; overflow:auto;" Some long text. /div. 1 ) { tr...
aamirafridi.com
jQuery Archives - musings of Aamir Afridi musings of Aamir Afridi
http://aamirafridi.com/category/jquery
Musings of Aamir Afridi. JQuery Marquee Plugin with CSS3 Support. For details about new updates. Also the plugin is now hosted on jsDelivr.com. Recently I been working on a project where a static text message needs to be animated similar to non-standard HTML marquee. Googling gives me quite few jQuery plugins but they got so many options and complex html layout/structure was needed for the plugin to work. I decided to make a simple jQuery plugin which can scroll the text either left, right, up or down.
aamirafridi.com
Know about Aamir Afridi, a London based front-end developer musings of Aamir Afridi
http://aamirafridi.com/me
Musings of Aamir Afridi. Nodejs & Front-end developer based in London, UK, currently working at tes.com. Times Educational Supplement). Having a Masters degree in E-commerce and about 8 years of professional experience. Keen in learning and understanding different MVC frameworks, templating engines, CSS preprocessor to speed up development, cross-browser development, different unite testing libraries and now different task runners like gulp, grunt and yeoman. XHTML, HTML4 and 5. GIT, SVN,. You can often ...
aamirafridi.com
Portfolio of Aamir Afridi musings of Aamir Afridi
http://aamirafridi.com/work
Musings of Aamir Afridi. I have been working as both developer and designer during the past 7 years on different projects for the companies in UAE, UK and USA. Here I will mention some of my live projects. E-commerce website powered by nopcommerce. Security company in London (responsive site). Google Zero Moment of Truth. Beyond UK – Bynd.com, worked on Front-end. Beyond UK – Bynd.com, worked on Front-end. Youtube Your Film Festival. Beyond UK – Bynd.com, worked on Front-end. Cyber-gear UAE, Front-end.
aamirafridi.com
Openlayers Archives - musings of Aamir Afridi musings of Aamir Afridi
http://aamirafridi.com/category/openlayers
Musings of Aamir Afridi. Recently I have been working on Openlayers. Where the user can draw different vector features on the Openlayers map and than show the results like area covered or radius of the polygon drawn. The best way I could found was to use Openlayers Popup. But in this case a ‘ draggable popup. 8216; so that user can drag this information popup around to see the map and features around. I didn’t find any built-in property to do so, so I tried jQuery-ui draggable. Add layer to the map.
aamirafridi.com
Javascript Archives - musings of Aamir Afridi musings of Aamir Afridi
http://aamirafridi.com/category/js
Musings of Aamir Afridi. Controlling CSS animations with Javascript. Recently I been working on adding new features to my jQuery marquee plugin. I was trying to add CSS3 animation support to the plugin so it performs better as jQuery animate. Change the CSS property inside a loop to complete animations. For example animating something using jQuery animate:. See the Pen wdcIl. By Aamir Afridi ( @aamirafridi. Inside a timer i.e. To check the code, see this. Continue Reading →. For details about new updates.
aamirafridi.com
Experiments with HTML5 and CSS3 new features musings of Aamir Afridi
http://aamirafridi.com/lab
Musings of Aamir Afridi. In my spare time, I do experiments with new features of HTML5 and CSS3. Here is the list of few of them. You can also check my Codepen profile page. Flappy bird Game built using jQuery & CSS3 animations. Play in new window. Click here for the code. See the Pen Flappy Bird. By Aamir Afridi ( @aamirafridi. Tweets cloud using tagCanvas & Twitter REST API v1.1. Also try this Github repos version. Click here for the code. Control bricks game using your head. Open this in a new window.
aamirafridi.com
jQuery equal height columns plugin - musings of Aamir Afridi musings of Aamir Afridi
http://aamirafridi.com/jquery/jquery-equal-columns-height-plugin
Musings of Aamir Afridi. JQuery equal height columns plugin. I wrote a small jQuery plugin (only 696 bytes) to achieve 2 main goals:. Make these panels of equal height by identifying the smallest height among these panels and than reduce the text in other panels to make it of equal height to the smallest. And add an option to put three dots at the end of the paragraph if its not ending with a full stop. Should be able to start a plugin as simple as:. Http:/ stephenakins.blogspot.com Stephen Akins. 1 I th...
aamirafridi.com
CSS only responsive menu with unlimited levels musings of Aamir Afridi
http://aamirafridi.com/css/pure-css-responsive-menu
Musings of Aamir Afridi. Pure CSS toggle-based Responsive Unlimited Levels Menu. This is a brief tutorial to show you how to create a simple CSS-only responsive menu. You can find ready-to-use menus if you google for ‘pure css responsive menu’ and you will find variety of ways but most of them involves Javascript. I am going to use an approach which doesn’t require Javascript (unless you want to support older browsers). We will cover these steps:. CSS to style the menu for desktop browsers. Nav, nav a.
aamirafridi.com
Style placeholder text - musings of Aamir Afridi musings of Aamir Afridi
http://aamirafridi.com/css/styling-placeholder-text
Musings of Aamir Afridi. The placeholder attribute on. Elements provides a hint to the user of what can be entered in the field. The placeholder text must not contain carriage returns or line-feeds. The browsers so far implementing the gray color for placeholder text. Using pseudo-class you can change the appearance of placeholder text. Webkit based browsers (safari/chrome) */. Firefox 18 and below. Https:/ developer.mozilla.org/en-US/docs/Web/CSS/:-moz-placeholder. Hope for this */.
SOCIAL ENGAGEMENT