The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Place holder image with JS

2 posters

Go down

In progress Place holder image with JS

Post by Hert Tue Sep 08 2015, 14:46

Hello,

I wanted to have a place holder image for the RPG image, since this field is empty is nothing is put in and I find it prettier if there is an image there.
I looked around and figured this could be accomplished with the usage of a JS script. I am, however, very inexperienced with these codes and tried something but it didn't work. Sadly.
So this is the script I tried, I put it in the template of the profile (templates > profile > profile_view_body)
Code:
<script type="text/javascript">
//<![CDATA[

                if(typeof(_userdata) == "undefined")
               var _userdata = new Object();
                _userdata["image"] = "<img src="http://placehold.it/462x65" />";
           
//]]>
</script>
This is the HTML that is relevant:
Code:
<td width="462px"><div id="image">{RPG_IMAGE}</div></td>
And here is an URL: http://dungeon-explorers.actieforum.com/u3 and http://dungeon-explorers.actieforum.com/u1 for an account that does have input in this field.

Thanks in advance ^^

Greetings,
Hert
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

In progress Re: Place holder image with JS

Post by Ange Tuteur Tue Sep 08 2015, 16:57

Hi @hert,

You want something like this, right ?
Code:
(function() {
  var img = document.getElementById('image');
  if (!img.innerHTML) img.innerHTML = '<img src="" alt="" />';
})();

It'll get the element, and then check if the innerHTML content is empty. If it is, then it'll set the innerHTML for it.

The exclamation mark ( ! ) inverts the condition. In this one it means literally : "if img.innerHTML is empty" The equivalent would be :
Code:
if (img.innerHTML == '')
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum