corleoner corleoner - 4 months ago 11
Javascript Question

Extracting img from url - Script works in jsfiddle, but not on my site, can anyone spot the reason why?

Disclaimer: I'm about green as they get working with javascript:

So anyway, after much trial and error, and probably butchering this code, I've finally managed to enable auto embedding of media on my forum. I'm using oembed, and then a script for images and attachments. One problem though:

http://jsfiddle.net/khb8g6e3/

This one works on jsfiddle, but not on my site (using the same source code)
Here's the source
(not enough reputation points to post link, I'll try to add after).

My first attempt was this:

http://jsfiddle.net/edhg1zu0/

$(document).ready(function () {
var href = $('a.postlink.img-link').get(0).href;
$('a.postlink.img-link').html($('<img>').attr('src', href));
$('a.postlink.img-link').colorbox({
scalePhotos:'true',
maxHeight:'99%',
maxWidth:'99%',
opacity:'0.75',
fixed:true,
photo:true
});


})

Which works, but only shows one image over and over again.

I'd be happy with either code(whichever is easiest to fix), if someone could show me what I'm doing wrong.

Answer

To get it to work properly I had to remove the colorbox code because it was throwing js errors.

Try this:

$(document).ready(function () {
  $('a.postlink.img-link').each(function() {
    var href = $(this).attr('href');
    $(this).append('<img src="'+href+'">');   
  }) 
})

You can see it functioning here: http://jsfiddle.net/edhg1zu0/1/

Comments