Code For Making a Gif Image Appear on Forum

by Hazeleyez73 July 20th 2019, 11:55 pm

https://guardianscreations.forumotion.com/forum

Good evening,

Is there any way that we can get a code or tutorial for having a gif image of whatever it may be to popup on your forum. When it popup you can click on it and it will collect it.

I seen it in different Forums.

I seen we have a tutorial for adding pets, but its not really what I want.

For instance:

Whatever gif image it is, will be placed on your mini profile the one you see every time you post something that is on the right-side or left side. It will have a briefcase or whatever and the gif image you want that will popup on your screen. When you click on that image it will show on your mini profile how many gif images you clicked on.

Its a fun game to play.

Thanks Jen

by **SLGray** July 21st 2019, 3:49 am

The topic was posted in the wrong section, so I have moved it to the correct section.

Please read our forum rules: ESF General Rules

by **skouliki** July 21st 2019, 11:33 am

i think i have seen it also in an FM forum, it was a chasing ghost game and every time a ghost was caught by the member automatically a profile field was updated with the total amount
unfortunately, i dont have the code to help you and to be honest i haven't seen that code around

( i will be also interesting about that code )

by Ikerepc July 21st 2019, 11:40 am

Hazeleyez73 wrote:
https://guardianscreations.forumotion.com/forum

Good evening,
Is there any way that we can get a code or tutorial for having a gif image of whatever it may be to popup on your forum. When it popup you can click on it and it will collect it.

I seen it in different Forums.

I seen we have a tutorial for adding pets, but its not really what I want.

For instance:

Whatever gif image it is, will be placed on your mini profile the one you see every time you post something that is on the right-side or left side. It will have a briefcase or whatever and the gif image you want that will popup on your screen. When you click on that image it will show on your mini profile how many gif images you clicked on.

Its a fun game to play.

Thanks Jen

Where have you seen it, can you give me link where I can check it out and maybe test acc so I can try it out..

Looks like you need a whole plugin...

by Hazeleyez73 July 21st 2019, 7:01 pm

Thank you for replying, I seen it on proboards and I believe they use plugins for their forums.
https://www.proboards.com/library/plugins - Its called Scavenger Hunt.

Is there a way we can make something like this. I know many people in forums I am affiliate with would love to have this.

Thanks Jen

by Hazeleyez73 July 22nd 2019, 11:53 pm

Bump

I am just checking in here to see if anyone is working on this for me

I would like to have this gif please

Code For Making a Gif Image Appear on Forum Fairy-dust

by **SarkZKalie** July 24th 2019, 5:00 am

I'm still waiting for the day Forumotion may support installing plugin from a Plugin Store or Plugin Center look like that site, instead of installing manually to client's site Smile

))

by Hazeleyez73 July 24th 2019, 7:39 pm

@sarkZKalie - that would be good also. You will have many Members happy.

For now I would like to at least find out if my suggestion about the gif game would even work in Forumotion.

There is a lot of codes of Popup and disappearing but not so much what I want to use it for.

by Hazeleyez73 July 27th 2019, 5:35 am

Bump- checking in on this

I have a 2 code that its kind of what I want, but the images are appearing to many of them at once. I just want to have one image appear and then minutes later have it appear again when you click it to disappear.

Code:: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript"> function addImage() { $('body').append('<p class="click-me" onclick="onImageClicked(this)"><img src="https://i.postimg.cc/c4s7tx7x/fairy-dust.gif" border="0" width="140" height="190"></p>'); } function onImageClicked(s) { $(s).remove(); if (++document.picturesRemoved == 20) { clearInterval(document.myInterval); } } $(document).ready(function () { document.picturesRemoved = 0; document.myInterval = setInterval(addImage,1000); }); </script> </head> <body>

Code:: <div class="fairy-dust.gif"> <img src="https://i.postimg.cc/c4s7tx7x/fairy-dust.gif" onclick="<fairy-dust.gif(this)"/> </div> <div id='countervalue'>0</div>

Then this is one that actually counts your clicks, but I would like it to put it on their profile

So can we make a code out of this some how?

by Hazeleyez73 July 28th 2019, 5:53 pm

Bumping this thread - Checking in if anyone is helping me with this. Code For Making a Gif Image Appear on Forum 1f600

by Hazeleyez73 August 3rd 2019, 11:46 pm

Bumping this

by Hazeleyez73 August 8th 2019, 11:59 pm

Checking on this if anyone is working on this for me

I found another code that fades in and out

Code:: (function makeDiv(){ var divsize = ((Math.random()*10) + 50).toFixed(); var color = '#'+ Math.round(0xffffff * Math.random()).toString(10); $newdiv = $('<div/>').css({ 'width':divsize+'px', 'height':divsize+'px', 'background-color': color }); var posx = (Math.random() * ($(document).width() - divsize)).toFixed(); var posy = (Math.random() * ($(document).height() - divsize)).toFixed(); $newdiv.css({ 'position':'absolute', 'left':posx+'px', 'top':posy+'px', 'display':'none' }).appendTo( 'body' ).fadeIn(1000).delay(1000).fadeOut(50, function(){ $(this).remove(); makeDiv(); }); })();

Not sure if anyone can convert this in to what I want, this code doesn't have the click to disappear it just appears and fade in and out.

by Guest August 9th 2019, 9:04 am

Hi,

Let me see if I got this right. In the user profile you have some type of a briefcase icon. When the user clicks that icon, a list of images that they collected will appear. How will the users collect those images? Will they just appear randomly in their briefcases? Will the images randomly display across the forum and users click on them to collect? If so, what will determine the image to appear? Will it be percent-based(like 40% chance of an image to appear)? Factoring in the number of posts a user has could also be a good idea for this.

by Hazeleyez73 August 10th 2019, 12:18 am

@Occultist - Yes, The Image will appear randomly and you click it and it disappears and collects the clicks and it puts it in a briefcase or whatever image it will be on the members mini profile.

The reason i like this, cause i can motivate my members to click on the image or gif whatever it is to add clicks and when a prize when they get to so so amounts of clicks.

It woud be nice if there is a setting to delete those points, when they get a gift. So they have to start over to get another gift.

I think making the code for this we should have options of what image we want on our screen to, since everyone has different opinions on images or gifs.

More ideas a good thing

"Will it be percent-based(like 40% chance of an image to appear)? Factoring in the number of posts a user has could also be a good idea for this."

by Storyteller of Wonderland August 10th 2019, 9:10 am

Hello!

I think you're talking about this?

I want to help you, but I'm not good at Javascript, and here it is what is required. But I was able to reproduce your task using CSS, though not completely, but is it something similar?

Just take a look at this:

http://milanwake.forum2x2.ru/h19-hunter

In a couple of seconds you will be on the page, you will see ghosts, quickly click on them !!!

But ... I created this with 1300 lines of CSS code and a little HTML5 markup. It is a lot to place such on each page.

I spread it so that anyone can help, understand what you need.

If you need the source, I can post the archive with the code here.

by Hazeleyez73 August 10th 2019, 9:42 pm

Hi Storyteller

Its cute but not quite what I Want.

I just want a single gif image - to appear randomly on the screen no back ground or nothing just the gif

when clicking the gif that appears disappears and adds a count of clicks

Code:: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript"> function addImage() { $('body').append('<p class="click-me" onclick="onImageClicked(this)"><img src="https://i.postimg.cc/c4s7tx7x/fairy-dust.gif" border="0" width="140" height="190"></p>'); } function onImageClicked(s) { $(s).remove(); if (++document.picturesRemoved == 0) { clearInterval(document.myInterval); } } $(document).ready(function () { document.picturesRemoved = 1; document.myInterval = setInterval(addImage,10000); }); </script> </head> <body>

For this code it would be nice just to have the one gif appear and not more in a row. It looks like if you dont click on the image it appears another one and another one. It should only have one gif appear and it just floats there until you click on there. I also when you click on it I dont want another gif to pop up again, it should pop up like 30 mins after.

Now just got to find a code that can generate the counts of clicks and it somehow puts it in a briefcase on members profile.