Javascript 代码编辑，使随机图像出现在Boostrap主题中
我需要一个简单的东西，但我是一个新的程序员，如果有人可以帮助它将是伟大的！事情是这样的： 我给你下面和下面的完整代码。如你所见，里面有8幅图像。我需要使用JavaScript使它们以随机顺序出现。我无法做到这一点，因为当我将脚本放在body中的Bootstrap组件中时，它没有得到Bootstrap的CSS样式。我怎样才能解决这个问题Javascript 代码编辑，使随机图像出现在Boostrap主题中,javascript,html,css,twitter-bootstrap,Javascript,Html,Css,Twitter Bootstrap,我需要一个简单的东西，但我是一个新的程序员，如果有人可以帮助它将是伟大的！事情是这样的： 我给你下面和下面的完整代码。如你所见，里面有8幅图像。我需要使用JavaScript使它们以随机顺序出现。我无法做到这一点，因为当我将脚本放在body中的Bootstrap组件中时，它没有得到Bootstrap的CSS样式。我怎样才能解决这个问题 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN"> <head&g
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>3 Col Portfolio - Start Bootstrap Template</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/3-col-portfolio.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script type="text/javascript">
var gallery = new Array();
gallery[0] = new Array(new Array ("immagine_prova5.png", "http://www.altervista.org"),
new Array ("immagine_prova6.png", "http://www.ii.org"), new Array
("immagine_prova5.png", "http://www.google.it"), new Array ("module_04.jpg", "#04"));
gallery[1] = new Array(new Array ("module_05.jpg", "#0"), new Array ("module_06.jpg",
"#06"), new Array ("module_07.jpg", "#07"), new Array ("module_08.jpg", "#08"));
function pickImageFrom(whichGallery)
{
var idx = Math.floor(Math.random() * gallery[whichGallery].length);
document.write('<a href="' + gallery[whichGallery][idx][1] + '"><img src="img/' +
gallery[whichGallery][idx][0] + '"></a>');
}
</script>
</head>
<body>
<script language="javascript">pickImageFrom(1);</script><br /><br />
<p> </p>
<!-- Navigation --><nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container"><!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header"><button class="navbar-toggle" type="button" data-
toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-
only">Toggle navigation</span> </button> <a class="navbar-brand" href="#">Start
Bootstrap</a></div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div id="bs-example-navbar-collapse-1" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<!-- /.navbar-collapse --></div>
<!-- /.container --></nav><!-- Page Content -->
<div class="container"><!-- Page Header -->
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Page Heading <small>Secondary Text</small></h1>
</div>
</div>
<!-- /.row --> <!-- Projects Row -->
<div class="row">
<div class="col-md-4 portfolio-item">
<a href="#">
<img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="">
</a>
</div>
<div class="col-md-4 portfolio-item">
<a href="#">
<img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="">
</a>
</div>
<div class="col-md-4 portfolio-item">
<a href="#">
<img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="">
</a>
</div>
</div>
<!-- /.row --> <!-- Projects Row -->
<div class="row">
<div class="col-md-4 portfolio-item"><a href="#"> <img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="" /> </a>
</div>
<div class="col-md-4 portfolio-item"><a href="#"> <img class="img-responsive"/><script
async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script></a>
<!-- Responsive Ad -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-2393383294332670"
data-ad-slot="4230127403"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script> </div>
<div class="col-md-4 portfolio-item"><a href="#"> <img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="" /> </a>
</div>
<!-- Projects Row -->
<div class="row">
<div class="col-md-4 portfolio-item"><a href="#"> <img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="" /> </a>
</div>
<div class="col-md-4 portfolio-item"><a href="#"> <img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="" /> </a>
</div>
<div class="col-md-4 portfolio-item"><a href="#"> <img class="img-responsive"
src="http://laprovadelnove.altervista.org/img/immagine_prova5.png" alt="" /> </a>
</div>
</div>
<!-- /.row --><hr /><!-- Footer --><footer>
<div class="row">
<div class="col-lg-12">
<p>Copyright © Your Website 2014</p>
</div>
</div>
<!-- /.row --></footer></div>
<!-- /.container -->
<p> </p>
<!-- jQuery Version 1.11.0 -->
<script src="js/jquery-1.11.0.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
3列组合-启动引导模板
var gallery=新数组（）；
gallery[0]=新数组（新数组（“immagine_prova5.png”）http://www.altervista.org"),
新数组（“immagine\u prova6.png”http://www.ii.org新阵列
（“immagine_prova5.png”http://www.google.it新阵列（“module_04.jpg”，“#04”）；
gallery[1]=新数组（新数组（“module_05.jpg”）、“#0”）、新数组（“module_06.jpg”，
新数组（“module#07.jpg”，“#07”）、新数组（“module#08.jpg”，“#08”）；
函数pickImageFrom（whichGallery）
{
var idx=Math.floor（Math.random（）*gallery[whichGallery].length）；
文件。写（“”）；
}
从（1）中选取图像
切换导航
页眉辅助文本
（adsbygoogle=window.adsbygoogle | |[]）.push（{}）；
版权及副本；您的网站2014
document.write('<a href="' + gallery[whichGallery][idx][1] + '">
<img class="img-responsive" src="img/' + gallery[whichGallery][idx][0] + '"></a>');
document.write（“”）；