[Share] code slideshow ảnh bằng javascript + css + html cho wap/web -- thantienvxp

Trang chủ > Share code xtgem

» Thể loại: Share code xtgem
» Last Updated: 08/05/16
» Lượt xem: 4324 Views

Nội dung:

Share code javascript css html slideshow

Xem demo

Html viết:

Css viết:

* {box-sizing:border-box}
body {font-family: Verdana,sans-serif;margin:0}

.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 0;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

.dot {
  cursor:pointer;
  height: 13px;
  width: 13px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@media only screen and (max-width: 300px) {
  .slprev, .slnext,.text {font-size: 11px}
         }

Javascript:

Share code html, css cơ bản cho làm wap

Làm wap ai cũng phải biết html và css, với những code html, css cơ bản chắc chắn sẽ giúp bạn rất nhiều....

Hướng dẫn làm một trang điều hướng báo lỗi 404

Đối với mỗi trang wap một trong những thứ cơ bản và không thể thiếu là trang 404. Vậy làm sao để tạo được một trang 404 ?...

Bảng mã màu HEX đầy đủ cho html, css

Bảng mã màu đầy đủ cho làm web/wap rất hữu dụng là thứ không thể thiếu với các wapmaster ...

«1 2 34