简体   繁体   English

如何将图像循环到页面的整个宽度/高度

[英]how do i loop an image to the full width/height of the page

I am trying to loop a small image to 100% width of the page using a for loop.我正在尝试使用 for 循环将小图像循环到页面的 100% 宽度。

var gameW = window.innerWidth;
var gameH = window.innerHeight;
var grass = document.getElementById("grass");
var sand = document.getElementById("sand");

grass.src = "images/grass.png"

function makeMap(){
    for(var i = 0; i < gameW; i++){
         grass++;
    }
}makeMap();

You can do this with css (if that is an option).你可以用 css 来做到这一点(如果这是一个选项)。 background-repeat will probably do the job. background-repeat可能会完成这项工作。

For example, you can add a single div that has the width of your viewport and set its background to the image you want.例如,您可以添加一个具有视口宽度的 div,并将其背景设置为您想要的图像。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何为具有完整(100%)宽度和未知高度的图像设置样式,使其不会弹出 - How do I style an image with full (100%) width and unknown height so it doesn't pop 我将如何使滑块覆盖此页面的整个宽度和高度? - How would I make the slider cover the full width and height of this page? 在将图像加载到页面上之前,如何使用jQuery计算图像的宽度和高度? - How do I calculate the width and height of an image with jQuery, before I load the image on a page? 如何以全高和可变宽度居中图像 - How to center image with full height and variable width 如何使Bootstrap网格列成为页面的整个高度? - How do I make a Bootstrap grid column be the full height of the page? 如何使Bootstrap Carousel整个页面全宽? - How do I make my Bootstrap Carousel the full width of the page? CSS,如何仅在第一页加载时将最小高度/宽度设置为屏幕高度/宽度? - CSS, How do I set the min-height/width to the screen height/width only on first page load? 如何在Chrome应用中设置图像的宽度和高度? - How do i set the width and height of the image in chrome app? 如何在React中根据宽度动态设置图像高度? - How do I dynamically set image height based on width in React? KineticJS:如何获取Sprite或图片的宽度和高度? - KineticJS: How do I get the Width and Height of a Sprite or Image?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM