我有一个名为“progressbar.png”的图像。有没有一种方法可以使用 PHP 或 Javascript 裁剪此图像,每次页面加载时,图像都会根据进度百分比进行裁剪并加载到页面中。例如,如果图像宽 200 像素,则进度为 25% 时图像将被裁剪为仅 50 像素宽。
最佳答案
制作一个 div,将 div 的背景设置为您的图像,然后将 div 的宽度控制为您想要的任何内容。
HTML:
<div id="progressbar"></div>
CSS:
#progressbar{
background:url(progressbar.png) top left;
height:progressbarheightpx;
}
Javascript:
document.getElementById('progressbar').style.width='50px'
或者可以在 PHP 中通过直接将宽度直接打印到 div 来完成:
<div id="progressbar" width="<?php echo $percent_done*200;?>px"></div>
关于php - 使用 PHP 或 Javascript 裁剪图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11237224/