Sass Framework Compass bietet eine praktische Funktion, um die entgegengesetzte Richtung einer Position zu ermitteln, beispielsweise leftwenn Sie rightals Argument übergeben.
Diese Funktion benötigt nicht nur keinen Kompass, sondern akzeptiert auch eine Liste von Positionen anstelle einer einzelnen. Es behandelt auch ungültige Werte ordnungsgemäß. Nur das Beste!
/// Returns the opposite direction of each direction in a list /// @author Hugo Giraudel /// @param (List) $directions - List of initial directions /// @return (List) - List of opposite directions @function opposite-direction($directions) ( $opposite-directions: (); $direction-map: ( 'top': 'bottom', 'right': 'left', 'bottom': 'top', 'left': 'right', 'center': 'center', 'ltr': 'rtl', 'rtl': 'ltr' ); @each $direction in $directions ( $direction: to-lower-case($direction); @if map-has-key($direction-map, $direction) ( $opposite-directions: append($opposite-directions, unquote(map-get($direction-map, $direction))); ) @else ( @warn "No opposite direction can be found for `#($direction)`. Direction omitted."; ) ) @return $opposite-directions; )Verwendung:
.selector ( background-position: opposite-direction(top right); )Ergebnis:
.selector ( background-position: bottom left; )