基础5:将我的img大小设置为100%的div

Question

基础5:将我的img大小设置为100%的div

Jur*_*tje 5 javascript css jquery zurb-foundation zurb-foundation-5

我正在使用Foundation 5来设置基本页面.我想要一个按钮来改变某个div的背景图像.到目前为止这是有效的,但它只显示图像的某个区域.

这是我到目前为止的代码:

function cW() {
  document.getElementById("panel").style.backgroundImage =
    "url('https://dl.dropboxusercontent.com/u/36821301/csgo%20backgrounds/crimson-web.jpg')";
  document.getElementById("panel").backgroundImage.style.maxWidth = "100%";
}

Run Code Online (Sandbox Code Playgroud)

<!DOCTYPE html>
<html lang="en">

<head>
  <title>Foundation 5 testing</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta charset="utf-8" />
  <link type="text/css" rel="stylesheet" href="foundation_5.css">
  <link type="text/css" rel="stylesheet" href="include/foundation.css">
  <script src="include/foundation.min.js"></script>
  <script src="include/jquery.js"></script>
  <script src="include/modernizer.js"></script>
  <script src="foundation_5.js"></script>

</head>

<body>
  <div class="row">
    <div class="medium-12 columns">
      <div id="panel" class="panel">
        <h1>Foundation Page</h1>
        <p>Resize this responsive page to see the effect!</p>
        <ul class="button-group round">
          <li>
            <button type="button" class="button" value="cW" onclick="cW()">Crimson Web</button>
          </li>
          <li>
            <button type="button" class="button" value="mF" onclick="mF()">Marble Fade</button>
          </li>
          <li>
            <button type="button" class="button" value="d" onclick="d()">Doppler</button>
          </li>
          <li>
            <button type="button" class="button" value="rC" onclick="rC()">Rust Coat</button>
          </li>
          <li>
            <button type="button" class="button" value="dS" onclick="dS()">Damascus Steel</button>
          </li>
          <li>
            <button type="button" class="button" value="s" onclick="hB()">Hyper Beast</button>
          </li>
        </ul>
      </div>
    </div>
  </div>
</body>

</html>

Run Code Online (Sandbox Code Playgroud)

我想要实现的目标:我希望在特定div中使用完整大小的图像.

谢谢