golf swing – Thingography.com https://thingography.com More than a Photo Gallery Mon, 18 Feb 2019 23:55:48 +0000 en-US hourly 1 Golf Swing CSS Animation https://thingography.com/css-golfswing/ https://thingography.com/css-golfswing/#respond Sun, 18 Feb 2018 20:56:09 +0000 http://thingography.com/my-things/?p=126 .golfswing-bg { width: 100%; height: 100%; position: absolute; } .ballbox { margin: 0px auto 0px auto; position: relative; width: 100%; height: 450px; } .ball { width: 80px; height: 250px; background: none; position: absolute; top: 50%; left: 50%; margin-top: -30px; margin-left: -60px; border-radius: 0px; transition: transform 5s; box-sizing: content-box; } #prop { position: relative; top: 50%; left: 50%; margin-top: -25px; margin-left: 5px; box-sizing: content-box; } #g-ball { top: 50%; left: 50%; position: absolute; margin-top: 204px; animation:g-ball 5s linear infinite; animation-delay: 1.75s; box-sizing: content-box; } @keyframes g-ball { 0% {transform:translate(0px,0px);} 50% {transform:translate(0px,0px);} 75% {transform:translate(0px,0px);} 100%{transform:translate(1000px,-416px);} } .ball { animation: swing 5s infinite; animation-delay: 3s; } @keyframes swing { 0% {transform: rotate(0deg);} 20% {transform: rotate(0deg);} 42% {transform: rotate(240deg);} 70% {transform: rotate(-205deg);} 100%{transform: rotate(0deg);} }

Golf Club

Golf Ball

]]> https://thingography.com/css-golfswing/feed/ 0