Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

slide.css - v3.1.4 - bug fixes + alternative 'stretchy' css

By: rcain on Dec 13th, 2011  |  syntax: CSS  |  size: 4.74 KB  |  hits: 94  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. /*mod jrc 131211: systemcore.co.uk - recommended bug fixes, various. also, new 'auto-resizable/stretchy image size, for fluid css designs: see mod marks 'mod jrc ...'*/
  2. /*based on code: http://wordpress.org/extend/plugins/promotion-slider/ */
  3. /*based on version: V3.1.4 */
  4. /*based on file: slide.css*/
  5. /*problem reference: http://wordpress.org/support/topic/plugin-promotion-slider-browser-scroll-bug-using-image-width-auto-suggested-fix  */
  6.  
  7.  
  8. .promo_slider_wrapper { margin:10px 0; position:relative; /*mod jrc 111211 - fix browser scroller jag eg: h=536px*//*height: auto;*/ /*end mod jrc 111211*/border:0px solid green;}
  9. .promo_slider { overflow:hidden; position:relative; /*mod jrc 111211 - orig: height:235px;*//*height:auto;*/ /*end mod jrc 111211*/  border:0px solid blue;}
  10. .promo_slider img { margin:0; padding:0; /*mod jrc 111211*/ width: 100%; height: auto;/*end mod jrc 111211*/}
  11. .promo_slider .panel { background:url('images/slide.png'); display:none; /*float:left;*/ overflow:hidden; /*mod jrc 131211 - orig: width: 100%; height:100%;*//*width:100%;  height: 100%;*/ border:0px solid yellow;}
  12. .promo_slider .panel-1 { display:block; }
  13. .pointer {cursor:pointer; cursor:hand;}
  14. .ps_hover { display:none; }
  15. .promo_slider:hover .ps_hover { display:block; }
  16. .promo_slider_sep { font-weight:normal; }
  17.  
  18. /*mod jrc 131211*/
  19. .promo_slider_background_image {
  20. height: auto;
  21. border:0px solid red;
  22. }
  23.  
  24. /*end mod jrc 131211*/
  25.  
  26. /* DEFAULT SLIDER NAV - If enabled */
  27. .promo_slider_nav {
  28.         display:none;
  29.         position:absolute;
  30.         bottom:0px; right:0px;
  31.         margin:10px;
  32.         padding:5px 10px;
  33.         background-color:#fff;
  34.         color:#666; text-align:center;
  35.         font-size:12px;
  36.         font-weight:bold;
  37. }
  38. .fancy_ps_nav {background:url('images/nav.png') no-repeat transparent; width:147px; height:49px; line-height:49px; margin:0; padding:0;}
  39. .slider_selections span.current {color:#000;}
  40.  
  41. /* OPTIONAL SLIDER NAV LINKS - If enabled */
  42. .left_arrow, .right_arrow {/*mod jrc 111211 - orig: position:absolute; top:45%; width:30px; height:30px;*/
  43.         position:absolute;
  44.         top:0%;
  45.         width:10%;
  46.         height:100%;
  47.         display: block;
  48. /*      display: block;
  49.         position: relative;
  50.         top: 0px;
  51.         width:100px;
  52.         height:100%; */
  53.         background-color:#000;
  54.         filter:alpha(opacity=60);
  55.         opacity:0.6;
  56.         border: 0px solid #000;
  57.         /*end mod jrc 111211*/
  58.         }
  59. /*mod jrc 111211*/
  60. .left_arrow:hover, .right_arrow:hover {
  61.         background-color:#FFF;
  62.         filter:alpha(opacity=30);
  63.         opacity:0.3;
  64. }
  65. /*end mod jrc 111211*/
  66. .left_arrow {/*mod jrc 111211 - orig:  left:5px; background:url('images/prev.png') no-repeat;*/
  67.         left:0px;
  68.         background:url('images/prev.png') no-repeat #000;
  69.         background-position: center center;
  70.         /*end mod jrc 111211*/
  71.         }
  72. .right_arrow {/*mod jrc 111211 - orig:  right:5px; background:url('images/next.png') no-repeat;*/
  73.         right:0px;
  74.         background:url('images/next.png') no-repeat #000;
  75.         background-position: center center;
  76.         /*end mod jrc 111211*/
  77.         }
  78.  
  79.  
  80. /* THUMBNAIL SLIDER NAV - If enabled */
  81. .promo_slider_thumb_nav { display:none; position:relative; height:50px; padding:10px 0; background:url('images/slide.png'); overflow:hidden;}
  82. .promo_slider_thumb_nav .thumb_nav { height:50px; margin:0 40px; padding:0; }
  83. .promo_slider_thumb_nav .right_arrow, .promo_slider_thumb_nav .left_arrow { top:20px; }
  84. .promo_slider_thumb_nav .slider_selections span { float:left; display:block; width:50px; height:50px; margin:0 4px 11px 4px; padding:0 1px; overflow:hidden; }
  85. .promo_slider_thumb_nav .slider_selections span.current { border:1px solid #fff; margin-top:-1px; padding:0; }
  86. .promo_slider_thumb_nav img { width:50px; }
  87.  
  88. /* TITLE DISPLAY - If enabled */
  89. .promo_slider_title {
  90.         display:block;
  91.         position:absolute;
  92.         padding:2.5%;
  93.         text-align:left;
  94.         font-size:1.5em;
  95.         font-weight:bold;
  96. /*mod jrc 111211 - orig -               width:95%; color:#000;  top:0px; left:0px;*/
  97.         width:auto;
  98.         top:10%;
  99.         left:10%;
  100.         background-color:#000;
  101.         filter:alpha(opacity=60);
  102.         opacity:0.6;
  103. /*      color:#fff;*/
  104.         color:#FFF;
  105. /*end mod jrc 111211*/
  106. }
  107. .fancy_ps_title {
  108.         background-image:url('images/title.png');
  109.         background-repeat:no-repeat;
  110.         background-position:right;
  111.         width:auto;
  112.         height:77px;
  113.         padding:0 40px 0 10px;
  114.         font-size:18px;
  115.         text-align:center;
  116.         line-height:77px;
  117. }
  118. .promo_slider_title a {/* mod jrc 111211 - orig - color:#000;*/color: #FFF; /*end mod jrc 111211*/ text-decoration:none;}
  119. .promo_slider_title a:hover {text-decoration:underline;}
  120.  
  121. /* EXCERPT DISPLAY - If enabled */
  122. .promo_slider_excerpt {
  123.         display:block;
  124.         position:absolute;
  125.         background-color:#000;
  126.         filter:alpha(opacity=60);
  127.         opacity:0.6;
  128.         color:#fff;
  129.         padding:3px 2.5%;
  130. /*mod jrc 111211 - orig:        width:95%;      bottom:0; left:0; */
  131.         top:30%;
  132.         left:15%;
  133.         width:65%;
  134.         height: 60%;
  135. /*end mod jrc 111211*/
  136. }
  137. .promo_slider_excerpt p {margin:0; padding:0;}
  138.  
  139.  
  140.  
create a new version of this paste RAW Paste Data