返回頂部和底部(動畫)

2022-09-10 10:15:13 字數 1972 閱讀 1664

>特效加工廠

title

>

<

script

srctype

="text/j**ascript"

>

script

>

<

style

type

="text/css"

>

body

#main

.go

.go a

.go .top

.go .feedback

.go .bottom

.go .top:hover

.go .feedback:hover

.go .bottom:hover

style

>

<

script

type

="text/j**ascript"

>

$(function

() ,

700);

});$(

".bottom

").click(

//定義返回底部點選向下滾動的動畫

function

() ,

700);

});})

script

>

head

>

<

body

>

<

div

id="main"

>

<

div

class

="go"

>

<

a title

="返回頂部"

class

="top"

>top

a>

<

a title

="如果您有意見,請反饋給我們!"

class

="feedback"

href

=""target

="_blank"

>反饋

a>

<

a title

="返回底部"

class

="bottom"

>bottom

a>

div>

div>

body

>

html

>

效果圖:

相容zepto另外一種:

html:

<

a href

="j**ascript:;"

class

="public_gotop"

id="gotop"

>

a>

樣式:

/*

返回頂部

*/.public_gotop

js簡寫:

zepto(function($) ).off().on('click',function());

} else );

};});

});

JS動畫之返回頂部案例

需求 一開始返回頂部圖示是隱藏的,當滾動到指定位置的時候,小圖示就會顯示出來,點選圖示,會緩動的返回頂部 技術點 window.scrollto x,y 瀏覽器顯示區域跳轉到指定的座標 我是最頂端.風吹馬尾千條線,雨打羊毛一片氈.風吹馬尾千條線,雨打羊毛一片氈.風吹馬尾千條線,雨打羊毛一片氈.風吹馬...

listView滑動到底部和頂部

xlistviewgetlistview setonscrolllistener new onscrolllistener override public void onscroll abslistview view,int firstvisibleitem,int visibleitemcount...

ionic返回頂部

1 引入content模組 import from ionic angular 2 例項化 viewchild content content content 括號內是頁面內容哪乙個部分,第二個content為名字,第三個為例項化的模組 3 用法 this.content.scrollto 0,0,...