tile-slide-menu Follow @yiiframework

This is my first public extension that allows to show a user menu based on tiled images sliding in the screen

Requirements ¶

• Tested on Yii 1.1.10 but should work on previous versions
• jQuery

Usage ¶

This extension is a widget so the usage is very simple:

• Unzip the extension in the application/protected/extensions/ folder
• In a view where you want to present the menu use something like:

$this->widget('ext.TileSlideMenu.TileSlideMenu', array(
    'menuTitle'=>'Yii Framework',
    'items'=>array(
        array(
            'text' => 'Main Site',
            'url'=>'http://www.yiiframework.com/',
            'urlTarget'=>'_blank'
        ),
        array(
            'text' => 'Demos',
            'url'=>'http://www.yiiframework.com/demos/'
        ),
        array(
            'text' => 'Guide',
            'url'=>'http://www.yiiframework.com/doc/guide/'
        ),
        array(
            'text' => 'Class Reference',
            'url'=>'http://www.yiiframework.com/doc/api/'
        ),
        array(
            'text' => 'Wiki',
            'url'=>'http://www.yiiframework.com/wiki/'
        ),
        array(
            'text' => 'Extensions',
            'url'=>'http://www.yiiframework.com/extensions/'
        ),
        array(
            'text' => 'Forum',
            'url'=>'http://www.yiiframework.com/forum/'
        ),
        array(
            'text' => 'Live Chat',
            'url'=>'http://www.yiiframework.com/chat/'
        ),
    )
));

The following widget options are available:

• cssFile - CSS File based on the included CSS file to customize the aspect of the menus

• menuTitle - A string to show as a menu title. If empty no title is displayed

• imageWidth - the value for width img tag property. Defaults to 100

• imageHeight - the value for height img tag property. Defaults to 100

• defaultImage - The default image to show if no image is configured for a menu item. Defaults to included Yii logo

• defaultUrlTarget - The default url target. Uses the same allowed values as target property. See http://www.w3schools.com/tags/att_a_target.asp

• items - array containing the menu items. Each item is allowed to have the following options:

  • visible - Boolean

  • imagePath - The path for the image to use on this menu item

  • urlTarget - The target for the menu item link. See http://www.w3schools.com/tags/att_a_target.asp

  • text - Item text to show bellow on mouse over

Resourcs ¶

• Demo Page
• Project