Yii 1.1: kscrollto

when the content of document is too much , use this widget you can easily scroll from bottom to top or some position!
6 followers

this extension originally is a fork of scrolltop . but the old one is need some more functionality so i fork it from sensorario

KScrollToWidget ' s default behavior is scroll to the top of the document , but you can also set an html tag 's id ,this is why this extension is named scrollTo but scrollTop . this extension is also a yii wrapper of this jquery plugin but add some other functionality .

if you need scroll from some link element to top please check out the original version :scrolltop

Requirements

...requirements of using this extension ( Yii 1.1 or above)...

Usage

first check out this extension and put it to your protected/extensions dir or some orther dir, then just use the path alias to refer it , i don't know you will put it to where but just use path alias of this widget . for me i just put it to my costumized dir .

if you put it to extension dir , you can change the following path alias 'common.widgets.KScrollToWidget' to 'ext.KScrollToWidget' or 'ext.KScrollToWidget.KScrollToWidget' , just depends on your situation , if you don't understand how to use the path alias please refer to http://www.yiiframework.com/doc/api/1.1/YiiBase#getPathOfAlias-detail or some wiki , forum topics to learn how to use yii 's pathOfAlias feature .

you can check it out from github : download it

//  in your view file :
 
 
<div style="height:600px">
    click the following  there button  to see the effects
</div>
    <div id='dest' > the left widget will scroll to  here   </div>
    <div style="height:1200px">
         click the following  there button  to see the effects
    </div>
<?php
 // echo str_repeat('<br/>',65)."\n";
 
 
$this->widget('common.widgets.KScrollToWidget',array(
        'label' => 'Go on top',
        'speed' => 'slow',
                                                   'cssSettings'=>array(
                                                      'background-color'=> '#78901f',
                                                       'width'=>'200px'
                                                  )
));
?>
 
<?php
$this->widget('common.widgets.KScrollToWidget',array(
        'label' => 'toTop2',
        'speed' => 2000,
        'position'=> 'center',
                                                  'dest'=> 100,
                                                  'cssSettings'=>array(
                                                    //  'background-color'=> '#446477'
                                                  )
)); ?>
 
 
 
<?php
 
$this->widget('common.widgets.KScrollToWidget',array(
        'label' => 'scroll to the dest div',
        'speed' => 200,
        'destination' => 'dest' ,
        'position'=> 'left',
                                                   'cssSettings'=>array(
                                                     'background-color'=> '#f26077'
                                                  )
)); ?>

Resources

...external resources for this extension...

Total 2 comments

#12120 report it
sanguina at 2013/02/27 08:04pm
Demo error

Looks nice however the Demo page link gives a 502 Bad Gateway error

#5498 report it
Peter JK at 2011/10/16 11:19pm
much better

instead of the old one, this is much better... thank you..

Leave a comment

Please to leave your comment.

Create extension