滚动鼠标自动绘画动画效果
代码语言:html
所属分类:动画
代码描述:滚动鼠标自动绘画动画效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> svg { fill: none; stroke: #1EFFBC; stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; position: fixed; margin: auto; top: 0; left: 0; right: 0; bottom: 0; width: 50%; max-width: 300px; max-height: 255px; } .path { stroke-dashoffset: 17000; stroke-dasharray: 16999; } .viewport { height: 3000px; } </style> </head> <body> <div class="viewport"></div> <svg viewBox="0 -1 306 256" preserveAspectRatio="xMidYMid meet"> <path class="path" d=" M219,95c-22-7-42-12-67-13S61,82,42,93c-12,6-19,14-23,27 c-4,15-8,65,11,84s33,29,69,38s108,18,140,0 c11-6,42-25,39-88c-3-63-14-97-52-125S134-8,105,17 s-72,123-71,170s25,52,69,59s70-2,80-20s23-41,23-79 s-7-66-44-94S88,25,80,32s-7,26-6,61s4,49,17,67 s54,65,117,55s73-29,80-52s25-75,2-.........完整代码请登录后点击上方下载按钮下载查看
网友评论0