You are here

Home » API reference » Image Zoom 7

imagezoom.css in Image Zoom 7 

div#zoom-img-wrapper {
  position: absolute;
  top: 0px;
  overflow: hidden;
  z-index: 1000;
}

div#zoom-img-wrapper.popup {
  left: 75%;
  width: 400px;
  height: 300px;
  border: 5px solid #000;
  background: #fff;
}

div#zoom-img-wrapper.inner {
  left: 0px;
}

img#zoom-img {
  position: absolute;
  top: 0px;
  left: 0px;
  max-width: none;
}

a.imagezoom {
  cursor: crosshair;
}

ul.imagezoom-thumbs {
  padding: 0px;
}

div.imagezoom-thumb-wrapper .imagezoom-thumb-image {
  float: left;
  list-style: none;
  padding: 5px 5px 0px 0px;
}

.imagezoom-thumb-wrapper .imagezoom-thumb-hide {
  display: none;
}

.zoom-img-title {
  position: absolute;
  width: 100%;
  background: #000;
  color: #fff;
  padding-left: 5px;
}

File

css/imagezoom.css
View source 
  1. div#zoom-img-wrapper {

  2.   position: absolute;

  3.   top: 0px;

  4.   overflow: hidden;

  5.   z-index: 1000;

  6. }

  7. 

  8. div#zoom-img-wrapper.popup {

  9.   left: 75%;

  10.   width: 400px;

  11.   height: 300px;

  12.   border: 5px solid #000;

  13.   background: #fff;

  14. }

  15. 

  16. div#zoom-img-wrapper.inner {

  17.   left: 0px;

  18. }

  19. 

  20. img#zoom-img {

  21.   position: absolute;

  22.   top: 0px;

  23.   left: 0px;

  24.   max-width: none;

  25. }

  26. 

  27. a.imagezoom {

  28.   cursor: crosshair;

  29. }

  30. 

  31. ul.imagezoom-thumbs {

  32.   padding: 0px;

  33. }

  34. 

  35. div.imagezoom-thumb-wrapper .imagezoom-thumb-image {

  36.   float: left;

  37.   list-style: none;

  38.   padding: 5px 5px 0px 0px;

  39. }

  40. 

  41. .imagezoom-thumb-wrapper .imagezoom-thumb-hide {

  42.   display: none;

  43. }

  44. 

  45. .zoom-img-title {

  46.   position: absolute;

  47.   width: 100%;

  48.   background: #000;

  49.   color: #fff;

  50.   padding-left: 5px;

  51. }