過渡緩解，從右到左，怎麼樣？

緩解通常從左到右移動，現在我想要從右到左更改它如何在CSS中設置它？過渡緩解，從右到左，怎麼樣？

例如：

transition:   background-position 150ms ease-out; 
-moz-transition: background-position 150ms ease-out; 
-webkit-transition: background-position 150ms ease-out; 
-o-transition:  background-position 150ms ease-out;

來源

2014-03-01 sIiiS

使用jQuery它和將是easear –

必須使用css而不是js！ – sIiiS

沒有默認方向爲transition荷蘭國際集團的性質。而ease-out只是一個transition timing function：

從Spec：

的transition-timing-function屬性描述瞭如何在過渡期間使用的中間值將被計算。它允許轉換以在其持續時間內改變速度。這些效果通常被稱爲緩動功能。無論哪種情況，都會使用提供平滑曲線的數學函數。

background-position過渡的方向，依賴於第一和最後值。

例如：

.box { 
    /* other styles here... */ 
    background-image: url(http://lorempixel.com/500/300); 
    transition: background-position 150ms ease-out; 
} 

/* Move the background image from right to left */ 
.box.rtl { background-position: 0 center; } 
.box.rtl:hover { background-position: 100% center; } 

/* Move the background image from left to right */ 
.box.ltr { background-position: 100% center; } 
.box.ltr:hover { background-position: 0 center; }

WORKING DEMO。

來源

2014-03-01 16:56:36

也許你可以嘗試這樣的事：

<html> 
<head> 
<style> 
div { 
    float: right; 

    width: 100px; 
    height: 100px; 
    background: red; 
    transition: width 2s; 
    transition-timing-function: linear; 
    text-align: center; 
} 

div:hover { 
    width: 300px; 
} 

body { 
    width: 500px; 
    border: solid black 1px; 
} 
</style> 
</head> 
<body> 

<div>sample</div> 

</body> 
</html>

浮動股利的權利，你有你自己的div開始在右側。當它擴展時，它會向左擴展。

來源

2015-05-11 05:45:00 TienPing

-1

這很簡單，
就像你左至右過渡，如果你想從右到左的過渡只使用float:right;當你造型你事業部（ECT）。

來源

2017-02-04 11:22:38

過渡緩解，從右到左，怎麼樣？

回答

相關問題