Trouble with HTML in listings
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎03-28-2018 06:00 PM
Hello,
when i use that html in my borwser it work fine .
but when i use it on Ebay the action onmouseover doesnt work
why is that?
<html><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="title" content=""> <meta name="keywords" content="{{keywords}}"> <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet"> <style> @charset "utf-8"; /* CSS Document */ * { padding: 0; margin: 0; outline: none; border: none; list-style: none; box-sizing: border-box; font-family: 'Lato', sans-serif; } p { font-size: 16px; line-height: 26px; color: #231f20; } img { max-width: 100%; } .wrapper { margin: 0 auto; width: 90%; max-width: 1100px; } .clear { clear: both; } header, section, .content_inner { width: 100%; float: left; } header { padding: 35px 0 45px 0; text-align: center; } .features { background: #f1f1f1; border-top: 1px solid #e3e3e3; border-bottom: 1px solid #e3e3e3; } .features ul { width: 100%; float: left; } .features ul li { width: 25%; display: table; border-right: 1px solid #d9d9d9; float: left; } .features ul li:last-child { border: none; } .features ul li div { width: 30%; height: 80px; display: table-cell; text-align: center; vertical-align: middle; } .features ul li span { padding: 0 20px 0 10px; width: 70%; height: 80px; display: table-cell; vertical-align: middle; font-size: 14px; letter-spacing: 1px; line-height: 22px; font-weight: 300; color: #676867; } .content { padding: 25px 0; } .content h2 { padding: 10px 20px 15px 20px; background: #231f20; text-align: center; font-weight: 400; font-size: 30px; color: #FFF; } .content_inner { background: #f1f1f1; } .image_gallery { padding: 20px; width: 50%; background: #FFF; border: 1px solid #e3e3e3; text-align: center; float: left; } /*GALLERY CSS*/ .container { width: 100%; position: relative; margin:0 auto; } .thumbnails { text-align: center; list-style: none; font-size: 0; } .thumbnails li { margin: 10px 5px 0 5px; width: 100px; height: 100px; background: #fff; display: inline-block; text-align: center; vertical-align: middle; } .thumbnails input[name="select"] { display: none; } .thumbnails .item-hugger { padding: 5px; width: 100%; height: 100%; position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; border: 1px solid #e3e3e3; transition: all 150ms ease-in-out; } .thumbnails label { position: absolute; top: 0; left: 0; right: 0; bottom: 0; cursor: pointer; } .thumbnails .title { padding: 20px 0 0; font-size: 18px; color: #555; transition: all 150ms linear; } .thumbnails .gallery_content { max-width: 540px; width: 100%; height: 540px; background: #fff; transition: all 150ms linear; display: flex; flex-direction: column; justify-content: center; align-items: center; overflow: hidden; opacity: 0; position: absolute; top: 0; left: 50%; transform: translateX(-50%); } .thumbnails input[name="select"]:checked + .item-hugger { border-color: #00aeef; } .thumbnails input[name="select"]:checked ~ .gallery_content { opacity: 1; } .white-box { height: 540px; overflow: hidden; } .item_desc { padding: 25px; width: 50%; float: left; } .item_desc h3 { margin-bottom: 10px; font-size: 26px; font-weight: 300; color: #00aeef; } .item_desc ul { margin-bottom: 10px; } .item_desc ul li, .tab ul li { list-style-type: disc; list-style-position: inside; font-size: 16px; line-height: 26px; color: #231f20; } /* CSS TAB */ .tabs { margin-top: 25px; display: flex; flex-wrap: wrap; width: 100%; float: left; } .tabs label { margin-right: 3px; padding: 10px 20px; background: #00aeef; border: 1px solid #00aeef; order: 1; display: block; cursor: pointer; text-align: center; font-size: 18px; font-weight: 300; line-height: 25px; color: #FFF; position: relative; z-index: 1; } .tabs .tab { order: 99; flex-grow: 1; width: 100%; max-height: 0; visibility: hidden; text-align: left; background: #f1f1f1; border: 1px solid #e1e1e1; margin-top: -1px; overflow-y: hidden; display: none; } .tabs input[type="radio"] { display: none; } .tabs input[type="radio"]:checked + label { color: #231f20; background: #f1f1f1; border: 1px solid #e1e1e1; border-bottom: 1px solid #f1f1f1; } .tabs input[type="radio"]:checked + label + .tab { padding: 20px; visibility: visible; display: block; max-height: none; } footer { padding: 25px 0; width: 100%; background: #231f20; float: left; } footer p { color: #646464; } footer p span { color: #00aeef; } @media only screen and (max-width: 1100px) { .tabs label { padding: 10px 15px; font-size: 16px; } } @media only screen and (max-width: 1024px) { .features ul li { width: 50%; border-bottom: 1px solid #e3e3e3; } .features ul li:nth-child(2) { border-right: none; } .features ul li:nth-child(3) { border-bottom: none; } } @media only screen and (max-width: 980px) { .image_gallery, .item_desc { width: 100%; } .tabs .tab, .tabs label { order: initial; transition: 300ms all; display: block; } .tabs label { width: 100%; margin-right: 0; margin-top: 0.2rem; } .tabs input[type="radio"]:checked + label { background: #f1f1f1; border-bottom: 1px solid #e1e1e1; } .tabs input[type="radio"]:checked + label + .tab { max-height: 400px; overflow-y: scroll; } } @media only screen and (max-width: 540px) { .features ul li { width: 100%; border-right: none !important; } .features ul li:nth-child(3) { border-bottom: 1px solid #e3e3e3; } .thumbnails .gallery_content, .white-box { height: 400px; } .thumbnails li { width: 70px; height: 70px; } } </style> </head> <body> <header> <div class="wrapper"> <a href="" target="_blank"><img src=""></a> <div class="clear"></div> </div> </header> <section class="features"> <div class="wrapper"> <ul> <li> <div><img src="https://wearephoenixteam.com/ebay/free-templates/images/temp1/worldwide.png" alt="ebay custom template"></div> <span>FREE SHIPPING WITHIN USA</span> </li> <li> <div><img src="https://wearephoenixteam.com/ebay/free-templates/images/temp1/secure.png" alt="ebay custom template"></div> <span>SAFE AND SECURE PAYMENT</span> </li> <li> <div><img src="https://wearephoenixteam.com/ebay/free-templates/images/temp1/moneyback.png" alt="ebay custom template"></div> <span>30 DAY MONEYBACK GUARANTEE</span> </li> <li> <div><img src="https://wearephoenixteam.com/ebay/free-templates/images/temp1/service.png" alt="ebay custom template"></div> <span>FRIENDLY CUSTOMER SERVICE</span> </li> </ul> <div class="clear"></div> </div> </section> <section class="content"> <div class="wrapper"> <h2> COSSCCI Solar Powered Water Fountain Pump Portable Submersible Free Standing for Bird Bath, Small Pond, Patio Garden Decoration(1.4W) </h2> <div class="content_inner"> <div class="image_gallery"> <div style="text-align: center;"> <img src=" https://gdurl.com/LbgG " name="galleryImg" style="width: 590px; height: 332px;"><br> <img src=" https://gdurl.com/LbgG" onmouseover="document.galleryImg.src='https://gdurl.com/LbgG';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/psiW" onmouseover="document.galleryImg.src='https://gdurl.com/psiW';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/lbgS4" onmouseover="document.galleryImg.src='https://gdurl.com/lbgS4';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/8B9w" onmouseover="document.galleryImg.src='https://gdurl.com/8B9w';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/8B9w" onmouseover="document.galleryImg.src='https://gdurl.com/8B9w';" style="width: 100px; margin: 5px;"> <br></div> <br> </div> <div class="item_desc"> <h3>DESCRIPTION</h3> <div vocab="https://schema.org/" typeof="Product"> <span property="description"> <ul class="a-unordered-list a-vertical a-spacing-none"> <li><span class="a-list-item"> Runs automatically by solar, no battery or electricity needed. Easy to move to different places to use. </span></li> <li><span class="a-list-item"> Comes with attachments and 3 different sprinkle heads to pump different water flows. An ideal pump for birdbath, small pond, fish tank and water circulation for oxygen </span></li> <li><span class="a-list-item"> The pump will start automatically in 3 seconds once exposed in sufficient sunlight. </span></li> <li><span class="a-list-item"> The solar fountain for birdbath has more than 10,000 Hours of service life. The solar water fountain pump has a built-in brushless motor that provides a longer service life and lower energy consumption. </span></li> <li><span class="a-list-item"> Suggestion: Solar panel must be fully exposed to sunlight, not any part of it can be shaded, or the pump will not work. </span></li> </ul> </span> </div> </div> </div> <div class="tabs"> <input type="radio" name="tabs" id="tabone" checked="checked"> <label for="tabone">DETAILS</label> <div class="tab"> <div class="w3-card-4"> <section class="w3-container sectionText" style="background-color: rgba(255,255,255,.9); padding-bottom: 5px;"> <p><b>Solar water pump operation suggested</b><br> 1. Remove the film which covers the solar panel before using;<br> 2. Solar panel must be fully exposed in sunlight without any part shaded by leaves or any other things;<br> 3. Let the solar pump under enough sunshine and water height depends on the strength of the sunlight.<br> 4.When the sunlight is weak, water pumps will not work continuously, once sunlight is stronger it will automatically continue to work;<br> 5. Pull out of the plug(the head part) firstly, and make the pump work for seconds to let the air go out of the pump, then put on the plug to see if it could work well;<br><br> <b>Specification</b><br> Solar Panel: 7V/1.4W<br> Brushless Pump Input: DC 4.5-10V<br> Maximum Flow: 150L/h<br> Maximum Spraying Height: 45cm(18’’), Regular: 10~15" <br> Minimum water depth in fountain should be 2" <br> Panel Size(Diameter x Thickness): 16 x 1.2cm<br><br> <b>Tips of Using the Solar Pump</b><br> 1. Clean the pump regularly to avoid pump from getting stuck. <br> 2. Don't make the pump work without water for a long time, or its lifespan will be shortened. <br> 3. The pumps will work continuously only under bright sunshine. It will also be affected by weather, seasons, places, etc. <br><br> <b>Package Includes</b><br> 1 x Solar Power Fountain Pump<br> 1 x A pouch of fittings (Nozzles inside)<br> 1 x User Manual<br><br> <b>After Service & Warranty</b><br> We provide 1 year warranty and 24 hour email customer support.<br> If you have any inquiry please feel free to contact us.<br> </p> </section> </div> </div> <input type="radio" name="tabs" id="tabtwo"> <label for="tabtwo">SHIPPING</label> <div class="tab"> <section class="w3-container sectionText" style="background-color: rgba(255,255,255,.9); padding-bottom: 5px;"> <p>Shipping is FREE to all addresses other than APO/PO boxes in the lower 48 states.</p> <p>Our stock all ships from our US-based warehouses. Shipped via USPS or UPS (depending on location and package weight) Unless stated otherwise, all orders will ship within 24-48 hours of your payment being processed.</p> <p>Domestic lower 48 free shipping is expedited. We have many different shipping locations depending on the product you buy and the shipping location that you choose.</p> <p>We try to ship most items within 24 hours of payment Monday-Friday. Most orders are in transit for two days but some may take longer. If you have a specific time frame please contact us before you make the purchase.</p> <p style="text-align: center;"><img src="https://s3-us-west-2.amazonaws.com/dsm-logos/60.jpg"></p> <section class="w3-container sectionText"> <p style="text-align: center;"><span style="color: #000000;">Check our feedback to see the great reviews of FAST shipping we offer.</span></p> </section> </section> </div> <input type="radio" name="tabs" id="tabthree"> <label for="tabthree">PAYMENT</label> <div class="tab"> <div class="w3-card-4"> <section class="w3-container sectionText" style="background-color: rgba(255,255,255,.9); padding-bottom: 5px;"> <h4 style="text-align: center;">PAYPAL PAYMENT IS ACCEPTED</h4> <h4 style="text-align: center;">We offer a <g class="gr_ gr_66 gr-alert gr_spell gr_run_anim ContextualSpelling multiReplace" id="66" data-gr-id="66">30 day</g> return policy for our products.</h4> <p style="text-align: center;"><img src="https://s3-us-west-2.amazonaws.com/dsm-logos/16.jpg"></p> <h4 style="text-align: center;"></h4> <h4 style="text-align: center;">We stand behind our products.</h4> <p style="text-align: center;">Return shipping is the responsibility of buyer unless the return is a result of our mistake. <br>We will pay for shipping replacement back to you if an exchange is requested.</p> <p style="text-align: center;"><span><strong>If you have any questions please contact us through "Ask seller a question" link. </strong></span><br><span><strong>We will respond within 1 business day or less.</strong></span></p> <p style="text-align: center;">All returns must be done within 30 days of the date of purchase. <br>Please note that we cannot give refunds after the <g class="gr_ gr_64 gr-alert gr_spell gr_run_anim ContextualSpelling multiReplace" id="64" data-gr-id="64"><g class="gr_ gr_64 gr-alert gr_spell gr_run_anim ContextualSpelling multiReplace" id="64" data-gr-id="64">30 day</g></g> limit has expired. <br>When sending in a return, please note that it can take up to 7 business days for the return to be processed. <br>We do our best to process as quickly as possible.</p> <p style="text-align: center;"></p> </section> </div> </div> <input type="radio" name="tabs" id="tabfour"> <label for="tabfour">RETURN</label> <div class="tab"> <section class="w3-container sectionText" style="background-color: rgba(255,255,255,.9); padding-bottom: 5px;"> <p style="text-align: left;"><br>Items can be returned for exchange or full refund within 30 days from the date you receive your merchandise.<span> </span><br>We are not responsible for any purchase after this 30-day period.</p> <p>Return shipping is the responsibility of buyer unless the return is a result of our mistake .<span> </span><br>We will pay for shipping replacement back to you if an exchange is requested.</p> <p></p> </section></div> <input type="radio" name="tabs" id="tabseven"> <label for="tabseven">CONTACT US</label> <div class="tab"> <p style="text-align: center;"><span style="color: #008000;"><strong>If you have any questions please contact us through "Ask seller a question" link. </strong></span><br><span style="color: #008000;"><strong>We will respond within 1 business day or less.</strong></span></p> <p style="text-align: center;"><span style="color: #008000;"><strong></strong></span></p> <p style="text-align: center;"><span style="font-size: 8pt; color: #808080;"></span></p> </div> </div> <div class="clear"></div> </div> </section> </body></html>
Trouble with HTML in listings
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎03-30-2018 02:45 AM
I will tag @shipscript to help you with your issue.
Trouble with HTML in listings
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
‎03-30-2018 08:58 AM - edited ‎03-30-2018 08:59 AM
The onmouseover event is javascript, so it no longer functions in eBay pages. When you attempt to list a description that includes javascript, you should see an alert above the description complaining about Active Content.
I can also see from your stylesheet that the included photo gallery is not the one intended for that template. The original template included a clickable CSS gallery that used the target attribute. Unfortunately, CSS animation is a lot messier than javascript, so CSS codes will be a lot bulkier.
If you do not have the original gallery code intended for that template, you can make an eBay-compliant CSS gallery here to replace the javascript version in your listing.
http://www.isdntek.com/csstools/photos.htm
http://www.isdntek.com/csstools/
You should be able to remove this block of code and then add the new gallery code in its place:
<img src=" https://gdurl.com/LbgG " name="galleryImg" style="width: 590px; height: 332px;"><br> <img src=" https://gdurl.com/LbgG" onmouseover="document.galleryImg.src='https://gdurl.com/LbgG';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/psiW" onmouseover="document.galleryImg.src='https://gdurl.com/psiW';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/lbgS4" onmouseover="document.galleryImg.src='https://gdurl.com/lbgS4';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/8B9w" onmouseover="document.galleryImg.src='https://gdurl.com/8B9w';" style="width: 100px; margin: 5px;"> <img src=" https://gdurl.com/8B9w" onmouseover="document.galleryImg.src='https://gdurl.com/8B9w';" style="width: 100px; margin: 5px;">
