How to make an image hover over another and export it as an image

Question

Ok, so i have a question. First let me post this:

<a href="#"><img src="http://i.imgur.com/ZRjnZlR.png" onmouseover="this.src='http://i.imgur.com/GPI0JA5.png'" onmouseout="this.src='http://i.imgur.com/ZRjnZlR.png'" /></a>

That's an html code that hovers an image. This works perfectly, the only problem is that i don't need it as an html code but i want to make it into a php file, since i'm on a forum that doesn't allow html.

So, how would i make that html code into a php, turn the outcome outcome into a png files so it looks like this and the outcome isn't this.

Remember, i'll be using bbcode to display that hover as an image.

By export image, I mean header("Content-Type: image/png");

You want PHP to make hover images? – Machavity Nov 11 '16 at 19:36 — Machavity, Nov 11 '16 at 19:36

GiftZwergrapper · Accepted Answer · 2016-11-15T11:15:15.290

0

Just create a ".php" file and echo the html code within php code:

<?php
    $img_src = 'http://i.imgur.com/ZRjnZlR.png';
    $mouseover_src = 'http://i.imgur.com/GPI0JA5.png';
    echo('<a href="#"><img src="' . $img_src .
        '" onmouseover="this.src=\'' . $mouseover_src . 
        '\'" onmouseout="this.src=\'' . $img_src . '\'" /></a>');

?>

Edit:

You can set a header with the PHP "header()" function, like so:

header('Content-Type: image/png');

edited Nov 15 '16 at 11:15

answered Nov 11 '16 at 19:52

GiftZwergrapper

2,602
2
20
40

Thanks, but it doesn't hover. :o – NekoTony Nov 11 '16 at 20:04
1

that's because there's a syntax error in this answer @Cheesezwheel and you need to find out why that is. I know, but the person who answered should fix it. Tip: view your html source and you'll see what it throws you back. – Funk Forty Niner Nov 11 '16 at 21:48
Fixed it, only problem is that I need it to be an image with `header("Content-Type: image/png");` – NekoTony Nov 11 '16 at 22:34
@Fred-ii- how would i make it header("Content-Type: image/png"); – NekoTony Nov 11 '16 at 23:29

How to make an image hover over another and export it as an image

1 Answers1