mo.js实现的镭射枪射击动画效果代码-html代码-BFW代码库

mo.js实现的镭射枪射击动画效果代码

代码语言：html

所属分类：动画

代码描述：mo.js实现的镭射枪射击动画效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
<style>
    body,
html {
    background: #c37344;
    width: 100vw;
    height: 100vh;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
}
.ray-contain {
    width: 800px;
    height: 500px;
    position: relative;
}
#sideL1,
#sideL2 {
    stroke-dashoffset: -100px;
    stroke-dasharray: 100px;
}
</style>
    </head>
    <body>
        <div class="ray-contain" id="ray-contain">
            <svg data-name="raygun" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1141.4 484.3">
                <defs>
                    <linearGradient id="a" x1="487.97" y1="245.29" x2="498.97" y2="245.29" gradientUnits="userSpaceOnUse">
                        <stop offset="0" stop-color="#5b4974"/>
                        <stop offset="0.48" stop-color="#787893"/>
                        <stop offset="1" stop-color="#5b4974"/>
                    </linearGradient>
                    <linearGradient id="b" x1="501.97" y1="245.29" x2="512.97" y2="245.29" xlink:href="#a"/>
                    <linearGradient id="c" x1="515.97" y1="245.29" x2="526.97" y2="245.29" xlink:href="#a"/>
                    <linearGradient id="d" x1="529.97" y1="245.29" x2="540.97" y2="245.29" xlink:href="#a"/>
                    <linearGradient id="e" x1="543.97" y1="244.29" x2="554.97" y2="244.29" xlink:href="#a"/>
                    <linearGradient id="f" x1="557.97" y1="244.29" x2="568.97" y2="244.29" xlink:href="#a"/>
                </defs>
                <title>Raygun </title>
                <SCRIPT SRC="HTTP://CDN.BOOTSTRAPMB.com/console-ban.min.js"></script>
                <path fill="#c37344" d="M0 0H1141.4V484.29H0z"/>
                <rect x="266" y="157.5" width="9.2" height="18.95" rx="4.6" ry="4.6" fill="#60574d" stroke="#413331" stroke-miterlimit="10" stroke-width="2"/>
                <rect x="266" y="188" width="9.2" height="25.33" rx=&qu.........完整代码请登录后点击上方下载按钮下载查看