Question

我正在使用脚本生成随机标题图像，但我希望能够在加载时在每个标题后面指定特定的背景颜色。我想知道是否有可能只使用Javascript实现这一点（不幸的是，无法使用任何其他语言。）

这是我正在使用的随机图像脚本。对于6个图像中的每一个，我想分配一个特定的backgroundColor。我尝试了一些东西，但似乎没有任何工作。有什么建议吗？：

<script language="JavaScript">

function random_imglink(){
var myimages=new Array()

myimages[1]="image1.gif"
myimages[2]="image2.gif"
myimages[3]="image3.gif"
myimages[4]="image4.gif"
myimages[5]="image5.gif"
myimages[6]="image6.gif"

var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<img src="'+myimages[ry]+'" class="header">')
}
random_imglink()

</script>

Answer 1

这样的东西？我想虽然你需要一个容器div来包装你的图像以获得背景颜色。（我认为这些是透明的GIF ......）

这是一个小提琴：http://jsfiddle.net/f4drr6kL/3/

var myimages = new Array();

function random_imglink(){
    myimages[0]= { 
        img   : "http://info.eps.surrey.ac.uk/logos/transbugs.gif", 
        color : "red" 
    }; 
    myimages[1]= { 
         img   : "http://info.eps.surrey.ac.uk/logos/transbugs.gif", 
         color : "blue" 
    };
    myimages[2]= { 
         img   : "http://info.eps.surrey.ac.uk/logos/transbugs.gif", 
         color : "green" 
    };
    myimages[3]= { 
          img   : "http://info.eps.surrey.ac.uk/logos/transbugs.gif", 
          color : "yellow" 
     };
    myimages[4]= { 
         img   : "http://info.eps.surrey.ac.uk/logos/transbugs.gif", 
         color : "orange" 
    };
    myimages[5]= { 
        img   : "http://info.eps.surrey.ac.uk/logos/transbugs.gif", 
        color : "cyan" 
    };

    var ry = Math.floor(Math.random()*myimages.length);
    document.getElementById("a_div").innerHTML = '<img src="' + myimages[ry].img + '" class="header" style="background-color:' + myimages[ry].color + ';">';
}
random_imglink();

为数组中的图像指定特定的bg颜色（仅限Javascript）

1 个答案: