"Electric Supplies Online"
Bootstrap 3.3.0 Snippet by themummer

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html> <head> <!-- JS and Bootstrap Libs --> <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" id="bootstrap-css" rel="stylesheet"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"> </script> <script src="//code.jquery.com/jquery-1.11.1.min.js"> </script> <title>Kim Lighting 4348/228T5/GR 49" Sign/Wall Landscape Lighting (2) 28W T5 Fluorescent Extruded Aluminum</title> </head> <body> <div class="container"> <div class="row"> <div class="col-12 col-centered text-center" id="brandmark"> <a href="index.html"><img alt="" border="0" class="center" height="94" hspace="0" src="https://sep.yimg.com/ca/I/electricsupplieson-line_2549_2350950479" vspace="0" width="925"></a> </div> <div class="breadcrumbs col-xs-12"> <a href="index.html">Home</a> > <a href="shop-by-brand.html">Shop By Brand</a> > <a href="kim-lighting.html">Kim Lighting</a> > <a href="kim-landscape-lighting-directional-light.html">Kim Landscape Lighting Directional Lights</a> > <a href="kim-landscape-lighting-sign-wall-directional-lighting-family.html">Kim Landscape Lighting Sign/Wall Directional Lighting</a> > <a href="kim-lighting-4348-wall-sign-landscape-light.html">Kim Lighting 4348 Wall/Sign Landscape Lighting</a> > Kim Lighting 4348/228T5/GR 49" Sign/Wall Landscape Lighting (2) 28W T5 Fluorescent Extruded Aluminum, Verde Green Finish </div> <div class="auto-style2"> <br> <div class="center col-12 col-centered text-center"> <a href="https://www.scanalert.com/RatingVerify?ref=www.electricsuppliesonline.com" target="_blank"><img alt="HACKER SAFE certified sites prevent over 99.9% of hacker crime." border="0" height="36" oncontextmenu="alert('Copying Prohibited by Law - HACKER SAFE is a Trademark of ScanAlert'); return false;" src="//images.scanalert.com/meter/www.electricsuppliesonline.com/23.gif" width="57"></a> <a href="//www.electricsuppliesonline.com/free-shipping-500-dollar.html"><img alt="" class="style1" height="36" src="https://p11.secure.hostingprod.com/@site.electricsuppliesonline.com/images/ssl/esolHomePage/logo/FREE-Shipping-logo-New-13.jpg" width="78"></a> <a href="//www.electricsuppliesonline.com/coupons.html" target="_blank"><img border="0" height="36" src="https://p11.secure.hostingprod.com/@site.electricsuppliesonline.com/images/ssl/esolHomePage/logo/Promo-Coupons-2.jpg" width="57"></a> <a href="//www.electricsuppliesonline.com/cataxin.html"><img alt="free-tax" class="auto-style1" height="34.8" src="https://p11.secure.hostingprod.com/@site.electricsuppliesonline.com/images/ssl/esolHomePage/tax-free.jpg" width="66.6"></a> </div> </div> <div class="col-xs-4 item-photo"><img src="https://sep.yimg.com/ca/I/electricsupplieson-line_2548_1621785877" style="max-width:100%;"></div> <div class="col-xs-5" style="border:0px solid gray"> <!-- Seller information and product title --> <h3>Kim Lighting 4348/228T5/GR 49" Sign/Wall Landscape Lighting (2) 28W T5 Fluorescent Extruded Aluminum, Verde Green Finish</h3> <h5 style="color:#337ab7">item # <a href="#">Kim-4348-228T5-GR</a></h5><!-- Precios --> <h6 class="title-price"><small>Our Price</small></h6> <h3 style="margin-top:0px;">$441.30</h3><!-- Product Details --> <div class="section" style="padding-bottom:20px;"> <h6 class="title-attr"><small>QUANTITY</small></h6> <div> <div class="btn-minus"> <span class="glyphicon glyphicon-minus"></span> </div><input value="1"> <div class="btn-plus"> <span class="glyphicon glyphicon-plus"></span> </div> </div> </div> <div class="section" style="padding-bottom:20px;"> <button class="btn btn-success"><span aria-hidden="true" class="glyphicon glyphicon-shopping-cart" style="margin-right:20px"></span> Add to cart</button> </div> </div> <div class="col-xs-9"> <ul class="menu-items"> <li class="active">Product Details</li> </ul> <div style="width:100%;border-top:1px solid silver"> <p style="padding:15px;"><small>Kim Lighting 4348/228T5/GR 49" Sign/Wall Landscape Lighting (2) 28W T5 Fluorescent Extruded Aluminum, Verde Green Finish</small></p><small></small> <ul> <li><small><strong>Housing:</strong> One-piece extruded aluminum with die-cast aluminum ends.</small></li> <li><small><strong>Swivel:</strong> Two die-cast aluminum, with locking teeth and 1/2" solid brass NPT mount. Swivel locked by 1/4-20 stainless set screw. Clear anodized prior to powder coating for added corrosion resistance.</small></li> <li><small><strong>Reflector:</strong> Specular Alzak.</small></li> <li><small><strong>Lens:</strong> Clear flat acrylic, fully gasketed, retained by a concealed extruded aluminum rail with recessed captive allen-head fasteners.</small></li> <li><small><strong>Socket:</strong> Medium bipin mounted on reflector.</small></li> <li><small><strong>Wiring:</strong> Factory prewired with No. 18AWM rated 105 C, leads extended from swivel base.</small></li> <li><small><strong>Ballast:</strong> Electronic ballast 0 F starting.</small></li> <li><small><strong>Finish:</strong> Super TGIC thermoset polyester powder coat paint, 2.5 mil nominal thickness, applied over a titanated zirconium conversion coating; 2500 hour salt spray test endurance rating.</small></li> <li><small><strong>Certification:</strong> UL Listed to U.S. and Canadian safety standards for wet locations.</small></li> </ul> <div class="col-12"> <p class="kimvalue">For dimensions and specification sheet, <a href="http://site.electricsuppliesonline.com/documents/kim-lighting/4348-Spec.pdf" rel="noopener" target="_blank">click here</a> - PDF.<br> For Kim Lighting color chart, <a href="https://p11.secure.hostingprod.com/@site.electricsuppliesonline.com/ssl/kl_colors_finishes_lit.pdf" rel="noopener" target="_blank">click here</a></p> <table width="100%"> <tr> <td> <a href="http://www.electricsuppliesonline.com/kim-lighting-4348-wall-sign-landscape-light.html" target="_blank"><img alt="Kim Lighting 4348 Landscape Lighting" border="0" class="center col-12 col-centered text-center" src="http://site.electricsuppliesonline.com/images/kimlighting/pic-link/Kim-4348-Aluminum.jpg"></a> </td> </tr> <tr> <td> <a href="http://www.electricsuppliesonline.com/kim-landscape-lighting-directional-light-120v.html" target="_blank"><img alt="Kim Lighting 120V Directional Landscape Lighting" border="0" class="center col-12 col-centered text-center" src="http://site.electricsuppliesonline.com/images/kimlighting/pic-link/Kim-120V-Directional-Light.jpg"></a> </td> </tr> <tr> <td> <a href="http://www.electricsuppliesonline.com/kim-landscape-lighting-sign-wall-directional-lighting-family.html" target="_blank"><img alt="Kim Lighting Sign/Wall Family Landscape Lighting" border="0" class="center col-12 col-centered text-center" src="http://site.electricsuppliesonline.com/images/kimlighting/pic-link/Kim-Sign-Wall-Family.jpg"></a> </td> </tr> </table> <table border="1" class="kimvalue" style="text-align:center;" width="100%"> <tr> <td bgcolor="#C0C0C0"><b>For More Kim Landscape Lighting Products, Click on the Pictures Below</b></td> </tr> <tr> <td> <a href="http://www.electricsuppliesonline.com/kim-lighting.html" target="_blank"><img alt="Kim Landscape Lighting" border="0" class="center col-12 col-centered text-center" src="http://site.electricsuppliesonline.com/images/kimlighting/pic-link/Kim-Lighting-Products.jpg"></a> </td> </tr> </table> </div> </div> </div> </div> </div> </body> </html>
ul>li { margin-right: 25px; font-weight: lighter; cursor: pointer } li.active { border-bottom: 3px solid silver; } .item-photo { display: flex; justify-content: center; align-items: center; border-right: 1px solid #f6f6f6; } .menu-items { list-style-type: none; font-size: 11px; display: inline-flex; margin-bottom: 0; margin-top: 20px } .btn-success { width: 100%; border-radius: 0; } .section { width: 100%; margin-left: -15px; padding: 2px; padding-left: 15px; padding-right: 15px; background: #f8f9f9 } .title-price { margin-top: 30px; margin-bottom: 0; color: black } .title-attr { margin-top: 0; margin-bottom: 0; color: black; } .btn-minus { cursor: pointer; font-size: 7px; display: flex; align-items: center; padding: 5px; padding-left: 10px; padding-right: 10px; border: 1px solid gray; border-radius: 2px; border-right: 0; } .btn-plus { cursor: pointer; font-size: 7px; display: flex; align-items: center; padding: 5px; padding-left: 10px; padding-right: 10px; border: 1px solid gray; border-radius: 2px; border-left: 0; } div.section>div { width: 100%; display: inline-flex; } div.section>div>input { margin: 0; padding-left: 5px; font-size: 10px; padding-right: 5px; max-width: 18%; text-align: center; } .attr, .attr2 { cursor: pointer; margin-right: 5px; height: 20px; font-size: 10px; padding: 2px; border: 1px solid gray; border-radius: 2px; } .attr.active, .attr2.active { border: 1px solid orange; } .center { display: block; margin-left: auto; margin-right: auto; height: 100%; } #brandmark { padding: 10px 0; } .breadcrumbs { padding: 19px 0; } @media (max-width: 426px) { .container { margin-top: 0px !important; } .container>.row { padding: 0 !important; } .container>.row>.col-xs-12.col-sm-5 { padding-right: 0; } .container>.row>.col-xs-12.col-sm-9>div>p { padding-left: 0 !important; padding-right: 0 !important; } .container>.row>.col-xs-12.col-sm-9>div>ul { padding-left: 10px !important; } .section { width: 104%; } .menu-items { padding-left: 0; } }
$(document).ready(function(){ //-- Click on detail $("ul.menu-items > li").on("click",function(){ $("ul.menu-items > li").removeClass("active"); $(this).addClass("active"); }) $(".attr,.attr2").on("click",function(){ var clase = $(this).attr("class"); $("." + clase).removeClass("active"); $(this).addClass("active"); }) //-- Click on QUANTITY $(".btn-minus").on("click",function(){ var now = $(".section > div > input").val(); if ($.isNumeric(now)){ if (parseInt(now) -1 > 0){ now--;} $(".section > div > input").val(now); }else{ $(".section > div > input").val("1"); } }) $(".btn-plus").on("click",function(){ var now = $(".section > div > input").val(); if ($.isNumeric(now)){ $(".section > div > input").val(parseInt(now)+1); }else{ $(".section > div > input").val("1"); } }) })

Related: See More


Questions / Comments: