Suche Javascript

[wavenetuser]

Hi ihr

Ich suche folgendes (vielleicht bereits fertiges) JS:
Af der Seite von http://www.amazon.com/ sieht man oben 3 Menüpunkte. Wenn man mit der Maus über "See all 35 Product Categories" fährt, öffnet sich ein popover mit einem Text darin.

Der Text wird wohl ein verstecktes DIV sein.
Vielleicht kennt jemand ein Multibrowser-kompatibles JS dafür bevor ich es selbst schreiben muss .

[Tom-Wien]

Code: Alles auswählen

</script>
<style>
.gc-popover-tiny { font-size: 10px; font-family: verdana,arial,helvetica,sans-serif; }
.gc-popover-tiny a, .gc-popover-tiny a:visited { text-decoration: none; color: #003399; }
.gc-popover-tiny a:hover { text-decoration: underline; color: #CC6600; }
.gc-tiny { font-family: verdana,arial,helvetica,sans-serif; font-size: 1em; }
.gc-title { font-family: tahoma, sans-serif; margin-top: 10px;
margin-bottom: 6px; color: #c60; font-weight: bold; line-height: 1em;
}
</style>
<div id="findGifts" style="display:none">
<table width=500px cellpadding="0" cellspacing="0" border="0" style="border:2px solid #A5C6DE;">
<tr>
<td>
<table width=100% style="border-bottom:1px dotted #999999;"><tr><td width="33%"><a href="/gp/gift-central/ref=cm_gift_topnav_gclogo/104-6790324-3343113"><img src="http://ec1.images-amazon.com/images/G/01/gifts/giftcentral/06/logos/gc-logo-popover-a._V39690492_.gif" width="116" alt="Gift Central" height="30" border="0" /></a></td>
<td width=66%><img src="http://ec1.images-amazon.com/images/G/01/gifts/giftcentral/06/popover-blurb._V37077551_.gif" width="318" alt="Gift Central" height="28" border="0" />
</td></tr>
</table>
</td>
</tr>
<tr>
<td valign="top">
<table width=100% cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
<tr>
<td style="padding-left:6px;"><div class="gc-title">Gift Guides</div></td>
<td style="padding-left:6px;"><div class="gc-title">Lists &amp; Registries</div></td>
<td style="padding-left:6px;"><div class="gc-title">More to Explore</div></td>
</tr>
<tr>
<td valign="top" class="gc-popover-tiny" style="line-height:2em;padding-right:6px;padding-top:3px;padding-left:6px;">
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/gift-central/gift-guides/am/holiday-guides/ref=cm_gift_topnav_gg_hol06_lp/104-6790324-3343113">Gifts for the Holidays</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/gift-central/gift-guides/am/price-guides/ref=cm_gift_topnav_gg_price_lp/104-6790324-3343113">Gifts by Price</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/gift-central/gift-guides/am/relationship-guides/ref=cm_gift_topnav_gg_rel_lp/104-6790324-3343113">Gifts by Relationship</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/gift-central/gift-guides/am/kids-guides/ref=cm_gift_topnav_gg_kids_lp/104-6790324-3343113">Gifts for Kids and Teens</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/gift-central/gift-guides/am/recipient-guides/ref=cm_gift_topnav_gg_recip_lp/104-6790324-3343113">Gifts by Personality</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/gift-central/gift-guides/am/occasion-guides/ref=cm_gift_topnav_gg_occ_lp/104-6790324-3343113">Gifts by Occasion</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<nobr><a href="/gp/gift-central/gift-guides/ref=cm_gift_topnav_gg_lp/104-6790324-3343113" style="font-weight:bold;">See all Gift Guides</a></nobr><br />
</td>
<td valign="top" class="gc-popover-tiny" style="line-height:1.7em;padding-right:none;padding-top:3px;padding-left:6px;">
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/registry/wishlist/ref=cm_gift_topnav_wl_hp/104-6790324-3343113">Wish Lists</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/registry/babyreg/ref=cm_gift_topnav_babyreg/104-6790324-3343113">Baby Registry</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/wedding/homepage/ref=cm_gift_topnav_wedreg/104-6790324-3343113">Wedding Registry</a><br /><br />
<span class="gc-tiny" style="font-weight:bold;color:#cc6600;"><nobr>Find someone's Wish List:</nobr></span><br />
<form style="margin:0px;" method="get" name="wishlist-search" action="/gp/registry/search.html/ref=cm_gift_topnav_wlsearch/104-6790324-3343113">
<input type="hidden" name="type" value="wishlist">
<nobr><input type="text" style="border:1px solid #999999;height:16px;width:130px;font-family:verdana,arial,sans-serif;font-size:9px;color:#666666;" value="name or e-mail" name="field-name" onclick="this.value='';" />&nbsp;
<input type="image" src="http://ec1.images-amazon.com/images/G/01/gifts/registries/wishlist/v2/go-button.gif" style="vertical-align:middle" value="Go" alt="Go"  onClick="parseName();" /></nobr>
</form>
</nobr><br />
</td>
<td valign="top" class="gc-popover-tiny" style="line-height:1.7em;padding-right:none;padding-top:3px;padding-left:6px;">
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/gift-central/organizer/ref=cm_gift_topnav_organizer/104-6790324-3343113">Gift Organizer</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/gp/ecards/homepage/ref=cm_gift_topnav_ecards/104-6790324-3343113">E Cards</a><br />
<strong><font color="#cc6600">›</font></strong>&nbsp;<a href="/Fresh-Flowers-Indoor-Plants/b/ref=cm_gift_topnav_flo/104-6790324-3343113?ie=UTF8&node=3745171">Fresh Flowers</a><br /><br />
<a href="/gp/product/B00067L6TQ/ref=cm_gift_topnav_gcert/104-6790324-3343113"><img src="http://ec1.images-amazon.com/images/G/01/gifts/giftcentral/06/giftcert/gift-cert-roto-pop-a._V39691089_.gif" width="157" alt="Gift Certificates" height="58" border="0" /></a><br />
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
                </td>
                <td valign="bottom" align="right">
                 
<script language="javascript" type="text/javascript">
  <!--
  function submitSearch(form) {
    var value = form.q.value;
    if (value) {
      if (value == "robots.txt" || value == "favicon.ico") {
        value = '"' + value + '"';
      }
      if (typeof(encodeURIComponent) != "undefined") {
        value = encodeURIComponent(value);
      } else {
        value = escape(value);
      }
      location.href = "http://a9.amazon.com/?dns=www&src=amz&qs=" + value;
    }
    return false;
  }

[wavenetuser]

Das ist aber leider nicht alles
Rauskopieren wäre auch für mich kein Problem
Aber das soll nicht Sinn der Ãœbung sein

PS: Es ist natürlich kein Problem, ein JS zu schreiben und die Höhe/Breite der DIV nach und nach zu beeinflussen. Jedoch soll es natürlich crossbrowserfähig sein - und eben da dachte ich, gibts viell. schon was fertiges.

Edit: Ich hab kurz getestet - müsste in etwa so ausschauen:

Code: Alles auswählen

<script type="text/javascript">
<!--
function gross(){
  document.getElementById('ausein').style.borderLeft = "2px solid #f4f4f4";
  document.getElementById('ausein').style.borderTop = "2px solid #f4f4f4";
  document.getElementById('ausein').style.borderRight = "2px solid #f4f4f4";
  document.getElementById('ausein').style.borderBottom = "2px solid #f4f4f4";
//alert(document.getElementById('ausein').style.width);
   var vorher_hoehe = document.getElementById('ausein').style.height;
   var result = parseFloat(vorher_hoehe);
   document.getElementById('ausein').style.height = (15+result);
   document.getElementById('ausein').style.width = (25+result);


   var nachher_hoehe = document.getElementById('ausein').style.height;
   var result1 = parseFloat(nachher_hoehe);


//alert("RESULT: "+result);
//alert(document.getElementById('ausein').style.width);
   if (result1 < 400){
//      alert(new_h);
      setTimeout("gross();", 10);
   } else {
//      alert(result);
      document.getElementById('auseint').style.visibility = "visible";
      return false;
   }
}

function klein(){

//alert(document.getElementById('ausein').style.width);
   var vorher_hoehe = document.getElementById('ausein').style.height;
   var result = parseFloat(vorher_hoehe);

   var vorher_breite = document.getElementById('ausein').style.width;
   var result_breite = parseFloat(vorher_breite);

   if (result > 15) document.getElementById('ausein').style.height = (result-15);
   if (result_breite > 25)  document.getElementById('ausein').style.width = (result-25);


   var nachher_hoehe = document.getElementById('ausein').style.height;
   var result1 = parseFloat(nachher_hoehe);


//alert("RESULT: "+result);
//alert(document.getElementById('ausein').style.width);
   if (result1 > 0){
      document.getElementById('auseint').style.visibility = "hidden";
//      alert(new_h);
      setTimeout("klein();", 10);
   } else {
//      alert(result);
  document.getElementById('ausein').style.borderLeft = "0px solid #f4f4f4";
  document.getElementById('ausein').style.borderTop = "0px solid #f4f4f4";
  document.getElementById('ausein').style.borderRight = "0px solid #f4f4f4";
  document.getElementById('ausein').style.borderBottom = "0px solid #f4f4f4";
      return false;
   }
if (result1 < 20){
  document.getElementById('ausein').style.borderLeft = "0px solid #f4f4f4";
  document.getElementById('ausein').style.borderTop = "0px solid #f4f4f4";
  document.getElementById('ausein').style.borderRight = "0px solid #f4f4f4";
  document.getElementById('ausein').style.borderBottom = "0px solid #f4f4f4";
      return false;

}
}
// -->
</script>
.......
<div id="ausein" style="width:0px; height:0px; float:left;">
          <div id="auseint" style="float:left; visibility:hidden ">Text...</div>
</div>
.......
<a href="#" onMouseOver="gross();"
            onMouseOut="klein();">bla bli blupp</a>

Aber das ist nur mit IE7 getestet und dann ist die Frage ob es auch wirklich funktioniert ... Und wie gesagt: Hab eigentlich keine Zeit für

[Tom-Wien]

Und wie gesagt: Hab eigentlich keine Zeit für

dann kanns ja auch wohl nciht so wichtig sein ...
btw: googeln soll da auch helfen nach java-scripts

außerdem soltle mein paste von vorhin ja auhc nur als "grober anstoß" gedacht sein, wies funktioniert ..

[wavenetuser]

danke für die tipps.
Vielleicht kennt trotzdem jemand was in die Richtung.