Trình chiếu ảnh cổ điển

Tìm kiếm một trình chiếu hình ảnh nền CSS. Nó đi kèm với chức năng tự động phát, hoàn hảo để chạy nó dưới dạng nền. Nó được phát triển và hoàn toàn đáp ứng. Nó rất nhẹ. Hãy bấm vào demo xem thử

<div class="info">Tài nguyên này được lấy cảm hứng từ điều này<a target="_blank" href="https://dribbble.com/shots/2705517-boldybae">sút bóng</a> bởi tài năng <a href="https://dribbble.com/tokito" target="_blank">Dat007.</a></div>
<section class="cd-slider">
  <ul>
    <li data-color="#FF384B">
      <div class="content" style="background-image:url(http://dat0007.sextgem.com/img/4.jpg)">
        <blockquote>
          <p>Tôi đã mặc chiếc váy đỏ vào đêm nay nhảy múa trong bóng tối dưới ánh trăng nhàn nhạt.</p>
          <span>Nỗi buồn mùa hè - Lana Del Rey</span>
        </blockquote>
      </div>
    </li>
    <li data-color="#FF9C00">
      <div class="content" style="background-image:url(http://dat0007.sextgem.com/img/3.jpg)">
        <blockquote>
          <p>Liệu anh có còn yêu em khi em không còn trẻ trung xinh đẹp nữa Liệu anh có còn yêu em không</p>
          <span>Trẻ đẹp - Lana Del Rey</span>
        </blockquote>
      </div>
    </li>
    <li data-color="#002AFF">
      <div class="content" style="background-image:url(http://dat0007.sextgem.com/img/9.jpg)">
        <blockquote>
          <p>Quần jean xanh Áo sơ mi trắng Bước vào phòng Bạn biết bạn đã làm tôi bỏng mắt</p>
          <span>Blue Jeans - Lana Del Rey</span>
        </blockquote>
      </div>
    </li>
  </ul>
  <nav>
    <div><a class="prev" href="#"></a></div>
    <div><a class="next" href="#"></a></div>
  </nav>
</section>

item[0].className = "current_slide";

for (var i = 0, len = item.length; i < len; i++) {
		var color = item[i].getAttribute("data-color");
		item[i].style.backgroundColor=color;
	}

// Detect IE
	// hide ripple effect on IE9
	var ua = window.navigator.userAgent;
		var msie = ua.indexOf("MSIE");
		if ( msie > 0 ) {
			var version = parseInt(ua.substring(msie+ 5, ua.indexOf(".", msie)));
			if (version === 9) { cdSlider.className = "cd-slider ie9";}
	}

if (item.length <= 1) {
		nav.style.display = "none";
	}

function prevSlide() {
		var currentSlide = cdSlider.querySelector("li.current_slide"),
			prevElement = currentSlide.previousElementSibling,
			prevSlide = ( prevElement !== null) ? prevElement : item[item.length-1],
			prevColor = prevSlide.getAttribute("data-color"),
			el = document.createElement('span');

currentSlide.className = "";
		prevSlide.className = "current_slide";

nav.children[0].appendChild(el);

var size = ( cdSlider.clientWidth >= cdSlider.clientHeight ) ? cdSlider.clientWidth*2 : cdSlider.clientHeight*2,
		    ripple = nav.children[0].querySelector("span");

ripple.style.height = size + 'px';
		ripple.style.width = size + 'px';
		ripple.style.backgroundColor = prevColor;

ripple.addEventListener("webkitTransitionEnd", function() {
			if (this.parentNode) {
				this.parentNode.removeChild(this);
			}
		});

ripple.addEventListener("transitionend", function() {
			if (this.parentNode) {
				this.parentNode.removeChild(this);
			}
		});

}

function nextSlide() {
		var currentSlide = cdSlider.querySelector("li.current_slide"),
			nextElement = currentSlide.nextElementSibling,
			nextSlide = ( nextElement !== null ) ? nextElement : item[0],
			nextColor = nextSlide.getAttribute("data-color"),
			el = document.createElement('span');

currentSlide.className = "";
		nextSlide.className = "current_slide";

nav.children[1].appendChild(el);

var size = ( cdSlider.clientWidth >= cdSlider.clientHeight ) ? cdSlider.clientWidth*2 : cdSlider.clientHeight*2,
			  ripple = nav.children[1].querySelector("span");

ripple.style.height = size + 'px';
		ripple.style.width = size + 'px';
		ripple.style.backgroundColor = nextColor;

ripple.addEventListener("webkitTransitionEnd", function() {
			if (this.parentNode) {
				this.parentNode.removeChild(this);
			}
		});

ripple.addEventListener("transitionend", function() {
			if (this.parentNode) {
				this.parentNode.removeChild(this);
			}
		});

}

updateNavColor();

function updateNavColor () {
		var currentSlide = cdSlider.querySelector("li.current_slide");

var nextColor = ( currentSlide.nextElementSibling !== null ) ? currentSlide.nextElementSibling.getAttribute("data-color") : item[0].getAttribute("data-color");
		var	prevColor = ( currentSlide.previousElementSibling !== null ) ? currentSlide.previousElementSibling.getAttribute("data-color") : item[item.length-1].getAttribute("data-color");

if (item.length > 2) {
			nav.querySelector(".prev").style.backgroundColor = prevColor;
			nav.querySelector(".next").style.backgroundColor = nextColor;
		}
	}

nav.querySelector(".next").addEventListener('click', function(event) {
		event.preventDefault();
		nextSlide();
		updateNavColor();
	});

nav.querySelector(".prev").addEventListener("click", function(event) {
		event.preventDefault();
		prevSlide();
		updateNavColor();
	});
  
  //autoUpdate
  setInterval(function() {
    if (autoplay) {
      nextSlide();
      updateNavColor();
    };
	},timeTrans);

})();  </script>

Tài nguyên này được lấy cảm hứng từ điều nàysút bóng bởi tài năng Dat007.

Tôi đã mặc chiếc váy đỏ vào đêm nay nhảy múa trong bóng tối dưới ánh trăng nhàn nhạt.
Nỗi buồn mùa hè - Lana Del Rey
Liệu anh có còn yêu em khi em không còn trẻ trung xinh đẹp nữa Liệu anh có còn yêu em không
Trẻ đẹp - Lana Del Rey
Quần jean xanh Áo sơ mi trắng Bước vào phòng Bạn biết bạn đã làm tôi bỏng mắt
Blue Jeans - Lana Del Rey

Ảnh 4

Ảnh sex 17

Chạm vào để copy

Gửi cho bạn bè

GỬI SMS

Trang hiện tại:
dat007.xtgem.com/trinh-chieu-anh/co-dien1/index.html

Trang trước

Quay lại ☜ ☞ Dat007

AD Dat007 Xin chào: