Take and display images [closed]

问题

I was wondering how can I make this happen.

I need to take all the images from the external link site and display them in other site. Is is posible to do without jQuery? With a simple javascript or flash?

Anyone can suggest somekind of tutorial's or something?

If javascript, then it has to be very simple code, because I want to make it work in eBay listing's.

Example: In the listing there will be sold a holder for XXX cell phone, and I want to put on the bottom a filmstrip or something similar for the exact same item(from the same category). I want to give it a funcionality so I would need to change only the link to the category and the pictures would be changed automatically. POSIBLE?

Thanks,

Please If I didn't make myself clear, ask and I will explain in more detail's.

回答1:

NOTE: The askers has stated this answer does not work INSIDE Ebay listings.
Other than that, it works so well, it'll irritate some 'web-developers' (LOL). I'm leaving it here for now.

I had a sneaky suspicion you did not own/control the external link site, thus to 'take all the images from the external link site and display them in other site' (as asked), would fall under cross-domain security restrictions.

So to in order to regain 'power to the user', just use http://query.yahooapis.com/.
jQuery would not be strictly needed.

EXAMPLE 1:
Using the SQL-like command:

select * from html 
where url="http://stackoverflow.com" 
and xpath='//div/h3/a'

The following link will scrape SO for the newest questions (bypassing cross-domain security bull$#!7):
http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20html%20%0Awhere%20url%3D%22http%3A%2F%2Fstackoverflow.com%22%20%0Aand%20xpath%3D%27%2F%2Fdiv%2Fh3%2Fa%27%3B&format=json&callback=cbfunc

As you can see this will return a JSON array (one can also choose xml) and calling the callback-function: cbfunc.

In your case you would fish for image-links and include them in your page.

Example 2:
As asked in the comments below, this example in pure JavaScript does not only fetch image-url's from a Ebay-store, it also fetches the product-title's and product url's (displaying them as hyperlinked images with product-title as the image's title). As such it also shows how one could dynamically build the yql-string and what one could do with the data that returns.

function cbfunc(json){
   if(json.query.count){
      var data=json.query.results.div;
      var i=0, l=data.length, htm='';
      for(;i<l;i++){
         htm+='<a href="'+data[i].a.href+'">' +
                 '<img title="'+data[i].a.img.title+'"' +
                       ' src="'+data[i].a.img.src+'">' +
              '</a>\n';
      }
      document.getElementById('output').innerHTML=htm;
   } else {
      alert('Error: nothing found'); return false;
   }
}

function fetchEbayStore(url){
   var yql="select a.href, a.img.src, a.img.title" +
           " from html" +
           " where url='" + url + "'" +
           " and xpath='//td/div[@class=\"image\"]'";
   yql="http://query.yahooapis.com/v1/public/yql?q=" +
       encodeURIComponent(yql) +
       "&format=json" +
       "&callback=cbfunc";
   getJSON(yql); //you need to provide getJSON or use a library
}

See this 'quick 'n dirty' jsfiddle to see the above example in action. Remember this is just meant for explanation, not production!

For more info: Read the yahoo's yql-documentation, see the live examples on the right side in the constructor.

来源：https://stackoverflow.com/questions/12079946/take-and-display-images

标签

javascript

jquery

flash

gallery

ebay-design-templates