Tag: how to
A simple guide about how to use Yeoman to setup your web application, test it and then built it for production.
Its the professional way to build your web app.
You all know about Twitter Bootstrap. It’s the top front-end development framework and it’s spreading more and more. And while this framework was made on standards and most of useful components were added to it, some of us may need to override some code of it for his/her needs.
I had a chance to work on that, i mean overriding. Let me explain what I was doing and how I did that.
I am here not talking about Server-side improvements. I am here talking about Front-End improvements that really affects the web page speed.
The time spent till the website is running on the client’s browser. If we analyze that time, we will get:
Request Time (in milliseconds)
Server Process Time, or response time (usually in milliseconds)
Downloading web page and files into browser (few to several seconds, depending on internet speed)
Rendering on browser.
Drang n’ Drop in HTML 5 is supported by: IE9+, Firefox 3.6+, Safari 4+, Opera 11+ and Chrome 12+. But its not supported yet for touch devices like Touch Mobiles and Tablets.
You may have a normal HTML Form, like: contact form, feedback form or any other forms in your website or any website you work on.
Did you think how difficult converting this FORM into AJAX?
Let me say, it will be very simple. Simple as 1 minute of changes.
How is that, right?
Here I will mention how to use the jquery animate function and the usability and flexibility of it.
The syntax of this function is:
$.animate(options, settings, callback);
/* you can replace setting with duration (in milliseconds) or words: ‘slow’, ‘normal’ or ‘fast’.
callback is optional */
Below is a list of popular and most used animation:
increasing/decreasing width and height
moving or scrolling html element
Now let me explain each in an example.
Using jQuery animate() function to do a smooth scrolling:
I have also created a div as follow:
Scroll to here
You need something to run your script. Create a button like this:
<input type=”button” onclick=”scollWin();” value=”Scroll up” />
The jQuery Code will be like this:
Here is something to try:
now jQuery window scrolling is done with animation.
The better way to load XML document on all browsers is to use AJAX technique.
So, How to load it then?