How to Implement ThickBox in Codeigniter ?

ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

Features:

• ThickBox was built using the super lightweight jQuery library. Compressed, the jQuery library is 20k, uncompressed it’s 58k.
• The ThickBox JavaScript code and CSS file only add an additional 15k (only 10k by using the thickbox-compressed.js) on top of the jQuery code. The CSS file could additionally be compressed if need be.
• ThickBox will re-size images that are bigger than the browser window.
• ThickBox offers versatility (images, iframed content, inline content, and AJAX content).
• ThickBox will hide form elements in Windows IE 6.
• ThickBox will remain centered in the window even when the user scrolls the page or changes the size of the browser window. Clicking an image, the overlay, or close link will remove ThickBox.
• Due to the ThickBox creator’s view that transitions should be tailored by individual authors, ThickBox windows do not implement fancy transitions. Feel free to add them as you see fit. Is this a feature? Well, some might say it is.
• ThickBox can be invoked from a link element, input element (typically a button), and the area element (image maps).

How can i open thickbox in codeigniter

Download latest codeigniter form codeigniter offcial website , and install it .more information visit: Introduction and Installation Of CodeIgniter Framework

Create js,css,images folders in root directory , then download thick box plugin files Download thickbox.js or thickbox-compressed.js, thickbox.css, and the loading graphic (loadingAnimation.gif) to your local machine (or cut and paste the code from the tabs). Along with these three files, a copy of the jQuery JavaScript library is needed. For this site, and ThickBox, I am using the compressed version of jQuery.

After downloading files ,put .js files in js folder, .css files in css folder, and images in images folder

ThickBox will work with only valid DTD so make sure before implementing ThickBox in your APP

now create view file in application/views/thickbox_view.php,create one controller application/controller/thickbox.php,load url helper

controller/thickbox.php

if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Thickbox extends CI_Controller {
 
    public function __construct() {
        parent::__construct();
        $this->load->helper('url');
        //load ci url helper
	}
 
	public function index()
	{
		$this->load->view('thickbox_view');
        //load views 
	}
}
 
/* End of file thickbox.php */
/* Location: ./application/controllers/thickbox.php */

application/views/thickbox_view.php