Posts

Showing posts from 2013

Htaccess Tips

1. Redirect to a secure https connection If you want to redirect your entire site to a secure https connection, use the following: RewriteEngine On RewriteCond %{HTTPS} !on RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} 2. Block script execution You can stop scripts in certain languages from running with this: Options -ExecCGI AddHandler cgi-script .pl .py .php .jsp. htm .shtml .sh .asp .cgi 3.  Restrict file upload limits for PHP You can restrict the maximum file size for uploading in PHP, as well as the maximum execution time. Just add this: php_value upload_max_filesize 10M php_value post_max_size 10M php_value max_execution_time 200 php_value max_input_time 200 4. Force a file to download with a “Save As” prompt. If you want to force someone to download a file instead of opening it in their browser, use this code: AddType application/octet-stream .doc .mov .avi .pdf .xls .mp4 5. Compress file output with GZIP You can add the following c...

How to increase a performance of a website?

There are three main reasons why front-end performance is the place to start. 1) There is more potential for improvement by focusing on the front-end. Cutting it in half reduces response times by 40% or more, whereas cutting back-end performance in half results in less than a 10% reduction. 2) Front-end improvements typically require less time and resources than back-end projects (redesigning application architecture and code, finding and optimizing critical code paths, adding or modifying hardware, distributing databases, etc.). 3) Front-end performance tuning has been proven to work. Over fifty teams at Yahoo! have reduced their end-user response times by following our performance best practices, often by 25% or more. Steps to increase the performance of a site: 1) Minimize HTTP Requests 2) Use a Content Delivery Network 3) Add an Expires Header 4) Gzip Components 5) Put Stylesheets at the Top 6) Put Scripts at the Bottom 7) Avoid CSS ...

How to speed up your php website

There is a nice technique to reduce the amount of calls your browsers has to make to the server. This will be every image, every css and every JavaScript file included in the webpage. Each time you want to load in one of these elements you will be sending a request to the server which will return the requested object known as a HTTP request. Reduce Page Loading Time With PHP Each one of these uses up time on your page loading, so to reduce page load all you have to do is reduce the amount of calls being made. But what if you want to organise you JavaScript files, jquery file, general file, application file and page file. There could be upto 4 requests for some javascript for the page. It is possible in PHP to combine these JavaScript files together and trick the browser into thinking they are just one JavaScript file, therefore reducing the amount of calls being made to the server. This is done by reading the JavaScript with PHP then changing the header to JavaScript like the ...

JQuery Range Slider

Image
JQuery Range Slider enables you to capture a range of values with two drag handles. You can enable this mode by setting the rangeSlider property to true. Download URL : https://www.dropbox.com/s/vraijp19pf9mfyu/jqxslidert.rar Reference: http://www.jqwidgets.com

JQuery FlipBox

This plugin is used to flip the elements easily in four directions, top, bottom, left and right. You have to just a small code as in all the plugins and also you could add callbacks. HOW TO USE? Like every jquery plugin, just chain it: $("#flipbox").flip({ direction:'tb' }) HOW TO CHANGE CONTENT? Add content params in this way: $("#flipbox").flip({ direction:'tb', content:'this is my new content' }) HOW TO ADD CALLBACKS? There are three available callbacks: onBefore, onAnimation, onEnd $("#flipbox").flip({ direction:'tb', onBefore: function(){ console.log('before starting the animation'); }, onAnimation: function(){ console.log('in the middle of the animation'); }, onEnd: function(){ console.log('when the animation has already ended'); } }) HOW TO REVERT A FLIP? There's an "hidden" method called revertFlip: as it says, revert a f...

Responsive-Menu

This is also a simple jQuery plugin to convert list-based navigations into a select element for mobile devices and low browser widths. Options The options available for the plugin are listed below. Their default value appears next to their names, and available values below the description. combine [true] Convert multiple navigation lists into a single dropdown for mobiles [true/false] groupPageText ['Main'] Any <li> elements with <ul>/<ol> present get converted to an <optgroup>. As <optgroup> isn't selectable, a "dummy" <option> is added at the top of the group with the <li>'s value. This option sets the text for the "dummy" <option> ['string'] nested [true] This turns the <optgroup>s on and off [true/false] prependTo ['body'] Sets the container element for the menu to be put into. ['CSS-selector'] switchWidth [480] Sets the width (in pixels) at w...

JQuery File Upload

Image
File Upload widget with multiple file selection, drag&drop support, progress bars and preview images for jQuery. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads. Download Link :  https://www.dropbox.com/s/4q4u0i7ny8pp2za/jQuery-File-Upload-master.zip

HTML 5 Audio Player

Simple Player is a jQuery plugin that allows users to control audio files on their webpage. All browsers that supports HTML5 audio tag that allow mp3 or ogg format supported by this plugin.  There is no need to use flash (load flash plugin consumes much more memory extra) in some cases if you want to play a simple audio file.  Usage The jquery.simpleplayer.min.js file should be added to the head section of the HTML file after the jQuery JavaScript file. Below is how to include the JavaScript file using an absolute path, relative to the server root. <head>     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>     <script type="text/javascript" src="/jquery.simpleplayer.min.js"></script> </head> Then you should include the simpleplayer.css into your html. <link rel="stylesheet" href="simpleplayer.css" type=...

Create a Video in Html5

HTML5 <video> - DOM Methods and Properties HTML5 has DOM methods, properties, and events for the <video> and <audio> elements. These methods, properties, and events allow you to manipulate <video> and <audio> elements using JavaScript. There are methods for playing, pausing, and loading, for example and there are properties (like duration and volume). There are also DOM events that can notify you when the <video> element begins to play, is paused, is ended, etc. The example below illustrate, in a simple way, how to address a <video> element, read and set properties, and call methods. <!DOCTYPE html> <html> <body> <div style="text-align:center">   <button onclick="playPause()">Play/Pause</button>   <button onclick="makeBig()">Big</button>   <button onclick="makeSmall()">Small</button>   <button onclick="makeNormal()">Normal</...

charanblog: New HTML5 Tags

charanblog: New HTML5 Tags : HTML5 brings a host of new elements and attributes to allow developers to make their documents more easily understood by other systems (es...

New HTML5 Tags

HTML5 brings a host of new elements and attributes to allow developers to make their documents more easily understood by other systems (especially search engines!), display data more uniquely, and take on some of the load that has required complex JavaScript or browser plug-ins like Flash and Silverlight to handle. Here are 10 new items in HTML5 that will make it easier for you to write your Web sites. 1: <video> and <audio> One of the biggest uses for Flash, Silverlight, and similar technologies is to get a multimedia item to play. With HTML5 supporting the new video and audio controls, those technologies are now relegated to being used for fallback status. The browser can now natively display the controls, and the content can be manipulated through JavaScript. Don’t let the codec confusion scare you away. You can specify multiple sources for content, so you can make sure that your multimedia will play regardless of what codecs the user’s browser supports. 2: <...