http: //jsfiddle.net/gS78J/51/ готовое решение.
< !doctype html > <html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<style>
#flag {
background-size: 20px 15px;
display : infine-block;
height : 15px;
width : 20px;
}
</style>
</head>
<body>
<div>
<span class="name">Sergey</span>,
<span class="country">Russia</span>
<div id="flag"></div>
</div>
<script>
var userNames = [
'Сергей',
'Алексей',
'Анна',
'Николай',
'Даниил',
'Вячеслав',
'Джордж',
'Наталья',
'Татьяна',
'Анастасия',
'Евгений',
'Евгения',
'Марина',
'Мария'
],
userCountry = [
'Россия', 'Украина', 'Беларусь', 'Казахстан', 'Великобритания'
],
userFlag = [
'http://uploads.webflow.com/565cb911c193e4557db200d9/565da100af373f6c6d3ff95e_lan' +
'g-03.jpg',
'http://www.ua.all.biz/img/ua/catalog/767310.jpeg',
'http://www.belarus.by/relimages/000211_72754.jpg',
'https://upload.wikimedia.org/wikipedia/commons/thumb/d/d3/Flag_of_Kazakhstan.svg' +
'/500px-Flag_of_Kazakhstan.svg.png',
'http://uploads.webflow.com/565cb911c193e4557db200d9/565da11183428e142745e8e4_lan' +
'g-05.jpg'
],
source = [
6000, 10000, 2000, 20000
],
receiver = [];
setTimeout(function recursiveFn() {
var namerand = Math.floor(Math.random() * userNames.length),
countryrand = Math.floor(Math.random() * (userCountry.length));
console.log(namerand);
$("span.country").text(userCountry[countryrand]);
$("span.name").text(userNames[namerand]);
document
.getElementById("flag")
.style
.backgroundImage = "url(" + userFlag[countryrand] + ")";
if (!source.length) {
source = receiver.slice();
receiver.length = 0;
} else {
receiver.push(source.shift());
}
setTimeout(recursiveFn, source[0]);
}, source[0]);
</script>
</body>
</html>