課程
/前端開(kāi)發(fā)
/CSS3
/css3實(shí)現(xiàn)網(wǎng)頁(yè)平滑過(guò)渡效果
我按了按鈕以后無(wú)法進(jìn)行頁(yè)面的跳轉(zhuǎn),根本沒(méi)有改變,但是視頻上面就可以s-control-2對(duì)應(yīng)到s-panel-2等等的。
2018-04-05
源自:css3實(shí)現(xiàn)網(wǎng)頁(yè)平滑過(guò)渡效果 2-3
正在回答
#st-control-1:checked ~ .st-scroll{
-webkit-transform: translateY(0%);
-ms-transform: translateY(0%);
-o-transform: translateY(0%);
-moz-transform: translateY(0%);
transform: translateY(0%);
}
#st-control-2:checked ~ .st-scroll{
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
-moz-transform: translateY(-100%);
transform: translateY(-100%);
#st-control-3:checked ~ .st-scroll{
-webkit-transform: translateY(-200%);
-ms-transform: translateY(-200%);
-o-transform: translateY(-200%);
-moz-transform: translateY(-200%);
transform: translateY(-200%);
#st-control-4:checked ~ .st-scroll{
-webkit-transform: translateY(-300%);
-ms-transform: translateY(-300%);
-o-transform: translateY(-300%);
-moz-transform: translateY(-300%);
transform: translateY(-300%);
#st-control-5:checked ~ .st-scroll{
-webkit-transform: translateY(-400%);
-ms-transform: translateY(-400%);
-o-transform: translateY(-400%);
-moz-transform: translateY(-400%);
transform: translateY(-400%);
這個(gè)是切換的代碼? ?你看看你是不是寫(xiě)錯(cuò)了
舉報(bào)
CSS3 打造頁(yè)面之間的平滑過(guò)渡效果,帶來(lái)神奇的體驗(yàn)
2 回答求解,為什么我的代碼不能實(shí)現(xiàn)跳轉(zhuǎn)呢?反復(fù)對(duì)照視頻,確定代碼是一樣的啊
1 回答頁(yè)面不跳轉(zhuǎn),P,H2的動(dòng)畫(huà)不出來(lái)
7 回答點(diǎn)擊按鈕為什么頁(yè)面沒(méi)有跳轉(zhuǎn)呢?是什么地方錯(cuò)誤了?
2 回答能提供源代碼,為什么寫(xiě)的input radio 不互斥了
7 回答h2為什么按照這個(gè)代碼寫(xiě)完,沒(méi)有效果
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2018-05-26
#st-control-1:checked ~ .st-scroll{
-webkit-transform: translateY(0%);
-ms-transform: translateY(0%);
-o-transform: translateY(0%);
-moz-transform: translateY(0%);
transform: translateY(0%);
}
#st-control-2:checked ~ .st-scroll{
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
-moz-transform: translateY(-100%);
transform: translateY(-100%);
}
#st-control-3:checked ~ .st-scroll{
-webkit-transform: translateY(-200%);
-ms-transform: translateY(-200%);
-o-transform: translateY(-200%);
-moz-transform: translateY(-200%);
transform: translateY(-200%);
}
#st-control-4:checked ~ .st-scroll{
-webkit-transform: translateY(-300%);
-ms-transform: translateY(-300%);
-o-transform: translateY(-300%);
-moz-transform: translateY(-300%);
transform: translateY(-300%);
}
#st-control-5:checked ~ .st-scroll{
-webkit-transform: translateY(-400%);
-ms-transform: translateY(-400%);
-o-transform: translateY(-400%);
-moz-transform: translateY(-400%);
transform: translateY(-400%);
}
這個(gè)是切換的代碼? ?你看看你是不是寫(xiě)錯(cuò)了