Member Avatar for chunkmartinez

How do i keep this from showing up on my images on mouse over?

[IMG][/IMG]

because i noticed that some show up and some dont.

  • 4 Contributors
  • 7 Replies
  • 104 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by Member #114696

Dani AI

Generated

Short take: that small overlay is caused by how the browser is being given the image. noticed the behavior and hinted at the obvious workaround (wrap the image in HTML). Below are two practical, server-side approaches that avoid making lots of static pages and give predictable user experience.

A lightweight single-file viewer (recommended)
Use one dynamic viewer page that sanitizes the filename and renders the picture inside an HTML wrapper (so the browser never opens the raw image URL). That lets you add UI (caption, download button, lightbox) and avoids the overlay without creating many files.

<?php
// view.php?img=filename.jpg
$img = basename($_GET['img']);                // basic sanitize
$path = __DIR__ . '/images/' . $img;
if (!is_file($path)) { http_response_code(404); exit; }
?>
<!doctype html>
<html><head><meta charset="utf-8"><title>Image</title></head>
<body style="margin:0">
<div style="width:100vw;height:100vh;background:url('/images/<?php echo rawurlencode($img); ?>') center/contain no-repeat;"></div>
</body></html>

Force download (different UX)
If you want the file to download instead of display (so no overlay), send a Content-Disposition header. Example for Apache (.htaccess) or a small script that sets Content-Disposition: attachment and streams the file. This changes the user experience — they get a download dialog.

<IfModule mod_headers.c>
  <FilesMatch "\.(?i:gif|jpe?g|png)$">
    Header set Content-Disposition "attachment"
  </FilesMatch>
</IfModule>

Notes and cautions

  • Sanitize inputs to avoid path traversal.
  • Forcing downloads is intrusive for casual viewers; a viewer/lightbox gives better UX.
  • You cannot change a visitor's browser settings from the server; any per-machine setting for that toolbar must be altered by the user or sysadmin.
    This expands on ' suggestion without creating lots of static files and gives a server-side alternative to what observed.

Recommended Answers

All 7 Replies

Member Avatar for Member #114696

its shown when you open a image file with browser. well its a browser feature there's no way to stop that i suppose.

Member Avatar for Dani

Stop using Internet Explorer :)

Member Avatar for chunkmartinez

I dont like MSIE, i just use it because most people use it, and i can see how there seeing my page.

Member Avatar for MattEvans

it should only show up if you access an image file by a direct URL to the image itself: , you get a funny lil square with some arrows and a "thing" in the opposite corner aswell.

that's MSIE's standard way of dealing with image-type responses. Would you rather it attempted to download the image instead? =P

...So... to get rid of it... make loads of HTML pages with just <img> tags ^_-

Member Avatar for chunkmartinez

.....make loads of HTML pages with just <img> tags ^_-

What exactlt do you mean?

Member Avatar for Member #114696

What exactlt do you mean?

He means that instead of making links for images make several html files which have img tags for your images and thus it wont show that save buttons.

Well the idea is not bad if you use it woth a bit of Javascript or any other language. So you will not have to make several html pages.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.