Codeigniter remove index.php

Hola Amigos (Hello Friends in Spanish) 🙂 , In this post I am going to show how do we remove index.php in Codeigniter.
While you install fresh Codeigniter your URL is some thing like this:
example.com/index.php/class/function/ID
But this URL structure is not so much charming and is also not much SEO friendly. So we would like to change above URL to something life this:
example.com/class/function/ID
To modify the URL you need to enable mod_rewrite module first, since it’s initially disabled in apache configuration file. Open httpd.conf and search for “mod_rewrite”. If you are a WAMP user like me than to find httpd.conf in your Taskbar click WAMP icon -> Apache->httpd.conf. You will find a line with following text.
#LoadModule rewrite_module modules/mod_rewrite.so #AddModule mod_rewrite.c
Uncomment the lines (remove the trailing #) like this:
LoadModule rewrite_module modules/mod_rewrite.so #AddModule mod_rewrite.c
Than you need to restart the WAMP or whatever server you are using.
Now next step to to create a .htaccess file with following code.

RewriteEngine on
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]

Now if you remove index.php from you URL then it would perfectly work. In some of the server we will find error showing “No input file specified”. Then we need to just add “?” after index.php and it will solve problem.

RewriteEngine on
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?/$1 [L]

I hope this small post would help you some how. Happy Coding.
Reference
http://ellislab.com/codeigniter/user-guide/general/urls.html

Parallax Design

This is just a brief research done to gain the knowledge about the Parallax Design and gather the resource to about it. So I have mentioned different site links where I found suitable points. This is not a tutorial and want to help you find the suitable resource about the Parallax Design. Hope it helps.

Parallax…?
Parallax is a displacement or difference in the apparent position of an object viewed along two different lines of sight, and is measured by the angle or semi-angle of inclination between those two lines. (Wikipedia)
And what is Parallax Design?
According to unleashed-technologies.com : Parallax site design is which the background of the website moves at a different speed as the rest of the page for an impressive visual effect that allows for countless creative applications for online storytelling.
(The site also shows trending status, opportunity of use, downside and tips for the parallax design.)
So is Parallax Design a trending subject?
Yes, Google Trends Shows it as a growing trend in the since 2009 and its trending rapidly. Google,Flickr, Puma and other many big and small companies are using this design concept.
What about Compatibility Issues?
According to joshcarllewis.com : If we assume that only those who are using browsers that don’t support or have JavaScript won’t be able to use see any parallax effects, then  according to data from Yahoo that is 2% of average traffic in the US and 1.3% in the UK. While low this number is there and must be kept in mind. If only using the plugins to make some elements more exciting this shouldn’t be a problem as backgrounds will still remain, but sites that make heavy use of jQuery to take the user along a path with popups and animations will suffer badly.
What are requirements for Parallax Design?
According to site: onbile.com : following are the requirements for parallax design:

  • CSS: Containers with relative positions

  • CSS: Using absolute positioning

  • CSS: Using z-index floating objects

  • PNG images with transparent backgrounds

  • Images, using sprites

  • JavaScript to recognize scroll position

How to create a simple parallax effect?
Webdesignerdepot.com Shows the basic example of the parallax design. That simply scrolls the position of the background image with respect to the scroll of the browser content. (Demo)
Themeforest.com uses JQuery to take a horizontally scrolling website and add a parallax scrolling background effect reminiscent of old-school 2D platform games like Sonic the Hedgehog. (Demo)
Webdesignshock.com shows a bit advance way to the parallax design. (Demo)
Is there JQuery Plug-ins for the parallax design?
Yes, there are. Some of them are listed below:

Parallax plugins comparison
The comparison of the parallax plug-ins can be found in Github.com.
Inspirations

WordPress & Parallax Design.
As the WordPress is one of the most popular CMS, application of the parallax design in WordPress is also rapidly growing. Some parallax beautiful themes for WordPress:

Other Resources
• Behind The Scenes Of Nike Better World – Smashingmagazine.com
• Create a Parallax Scrolling Website Using Stellar.js – Tutsplus.com
• Parallaxin’ – Html5rocks.com
• Rise of the Parallax Effect – Joshcarllewis.com
• Parallax Scrolling and Its Usage in Web Design – Designmodo.com