无重复点击的随机图像

问题描述 投票:0回答:1

[目前,我正在该网站上工作,并在点击时弹出了一个随机图像,但是我的客户感觉有时候一个图像重复多次,所以他们要求我将其随机但不能重复。

这是网站链接:http://fullbleed.life/about/(“过去工作”部分应在其中工作)

谢谢!

imageString = [
  'http://fullbleed.life/wp-content/uploads/1.png',
  'http://fullbleed.life/wp-content/uploads/2.png',
  'http://fullbleed.life/wp-content/uploads/3.png',
  'http://fullbleed.life/wp-content/uploads/4.png',
  'http://fullbleed.life/wp-content/uploads/5.png',
  'http://fullbleed.life/wp-content/uploads/6.png',
  'http://fullbleed.life/wp-content/uploads/7.png',
  'http://fullbleed.life/wp-content/uploads/8.png',
  'http://fullbleed.life/wp-content/uploads/9.png',
  'http://fullbleed.life/wp-content/uploads/10.png',
]

name = [
  'Nordstrom',
  'Pylon',
  'ASP & Hand',
  'faris',
  'ARA',
  'traceme',
  'Microsoft',
  'Kozha Numbers',
  'Van Der Pop',
  'YFF',
]

function getRandom() {
  var min = 0
  var max = 10
  return Math.floor(Math.random() * max)
}

$('.past-work').bind('click', function(event) {

  var randNum = getRandom()
  var aProduct = document.getElementById('rand-images')
  var image = document.createElement('img')
  image.src = imageString[randNum]
  image.style.display = 'block'
  image.style.position = 'absolute'
  image.style.left = event.clientX - 280 + 'px'
  image.style.top = event.clientY - 280 + 'px'
  aProduct.appendChild(image)

  $(image).draggable()
      event.preventDefault()
})
<body><div class="row">
	<div class="col-md-12 past-work">
		<h1>PAST WORK</h1>
		<h4>(CLICK ANYWHERE, CLICK ANYWHERE AGAIN)</a></h4>
		<div class="picture">
		<div id="rand-images">
		</div>
	</div>
	</div>
	
	
</div>
</body>
javascript html arrays image random
1个回答
0
投票

您可以在显示后删除数组中的图像。

© www.soinside.com 2019 - 2024. All rights reserved.