This widget wraps BackToTop jquery plugin.
http://www.myjqueryplugins.com/jquery-plugin/backtotop
Usage ΒΆ
You can copy widget into extensions folder, such as:
protected/extensions/backToTop
Use it in your view file:
$this->widget('ext.backToTop.BackToTop',array(
'text'=>'Back To Top',
'autoShow'=>true
));
List of options for this widgets:
text: String, Default : '^ Back to top' - Text written into the link
autoShow: Boolean, Default : true - Does the link appears during scrolling the page or is always displayed ?
timeEffect: Integer, Default : 500 - Duration (in ms) of the scrolling effect, from the bottom to the top of the page
effectScroll: String, Default : 'linear' - all jQueryUI effects allowed
appearMethod: String, Default : 'slide' - How does the link appear ? Can be set to 'fade', 'slide' or empty
Good ext!
I have a question. I have it installed and it works perfectly! The only issue i have is that it always appears in the lower right corner no matter where i put it, in a div, another widget etc. I tried to change it in the css however that didn't work. When it's in the corner it is partially hidden by my footer. How do i change the placement to be on top of the footer or another location?
Thank you
solution
You can edit the file: assets/css/BackToTop.jquery.css
at line 11 , in order show it at the top you can change "bottom" to "top", for example
top: 20px;
right:80px;
And after changed, in order to apply your changes. you should delete all cached items in assets folder under webroot ( not our extension assets folde r)
RE:
EDIT: I don't why but my cache didn't clear and i thought it did. i had to cache my assets again. Thanks for you help!
RE:
I am using Yiibooster (boostrap extension) and it's working. You can try to change position of widget by chrome inspector and firebug then apply change to BackToTop.jquery.css
RE:
Will do. It just started to work for no reason :/. How can you get this to show on top of your items. i.e. it shows behind my cjutabs? it shows on top of a regular page with image and text.
Arrow
If you want to use just an arrow here is a link to a website with tons of html arrows
HTML Arrows and others
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.