Sunday, November 20, 2011

Nivo Silder - jQuery Plugin Usage

To use the Nivo Slider you have to include the following in your page:

jQuery
Nivo Slider script
Nivo Slider CSS
You also need to add some body HTML. This is ususally just a
with images. Note that only images or images wrapped in links are allowed in the slider div. Any other HTML will break the slider.

Download a Free Version From Here : Download Nivo Silder 
To add a caption to an image you simply need to add a title attribute to the image. To add an HTML Caption simply set the title attribute to the ID of a element that contains your caption (prefixed with a hash). Note that the HTML element that contains your caption must have the CSS class nivo-html-caption applied and must be outside of the slider div.
Then it helps to add some CSS to make the slider look good while it’s loading:
.nivoSlider {
    position:relative;
    width:618px; /* Change this to your images width */
    height:246px; /* Change this to your images height */
    background:url(images/loading.gif) no-repeat 50% 50%;
}
.nivoSlider img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
.nivoSlider a {
    border:0;
    display:block;
}
.nivoSlider {
    position:relative;
    width:618px; /* Change this to your images width */
    height:246px; /* Change this to your images height */
    background:url(images/loading.gif) no-repeat 50% 50%;
}
.nivoSlider img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
.nivoSlider a {
    border:0;
    display:block;
} 


Finally you need to hook up your script using the $(window).load() function:

The Nivo Slider has plenty of options to fiddle with. Below is an example of the code with all available options and their defaults: 
The effect parameter can be any of the following:

sliceDown
sliceDownLeft
sliceUp
sliceUpLeft
sliceUpDown
sliceUpDownLeft

etc...

Note: For Fix in IE & Opera Browsers (To Display Image) Use the Following Code in Style sheet.
#slider a{
    display:block;
}

Thursday, November 3, 2011

Pagination Conditions in Cakephp

Here the pagination conditions will be described for Cakephp v.1.2

function index() {
        $conditions = array($product['Product']['status']=>0);  // Give the  Pagination Condition.
        $paginationParameters = array();
        $paginationParameters['controller'] = 'products';
        $paginationParameters['action'] = $this->action;
        $this->paginate['Product'] = array(
        'limit' => 1,
        'order' => array ('Product.id' => 'asc'),
        'url' => array ('url' => $paginationParameters)
        );
        $products = $this->paginate($conditions);
        $this->Product->recursive = 0;
        $this->set('products',  $products);
    }
It Will Display the Products according to the Product Status in View page (like app/views/products/index.ctp)