Liela piezīme šeit! Bīdāmās durvis ir diezgan veca tehnika. Tam bija savs laiks tīmeklī, taču, iespējams, mūsdienās tas nav visgudrākais ceļš. Mums tagad ir robežas rādiuss, slīpuma fons un viss tas, kas paver lielāko daļu no tā, ko mēs centāmies sasniegt bīdāmo durvju dienā.
Bet joprojām ir jautri dokumentēt, kā tas darbojas, tāpēc šeit tas ir:
Sliding Doors Button .button ( float: left; clear: both; background: url(RIGHT_SIDE.png.webp) top right no-repeat; margin: 5px; padding-right: 20px; color: white; text-decoration: none; ) .button span ( background: url(LEFT_SIDE.png.webp) top left no-repeat; line-height: 22px; padding: 7px 0 5px 18px; display: block; ) .button:hover ( background-position: right -34px; ) .button:hover span ( background-position: 0 -34px; color: #fff; )Kas pieņem šādu grafiku:
Skatiet Chris Coyier (@chriscoyier) pildspalvas bīdāmo durvju pogas vietnē CodePen.