Custom display of images in my website - image

When you right-click on an image in firefox, and click on Display image, it displays it. And around it, there is a black background.
Can I put my own background image instead of the black background?

No - you're entering browser-level functionality that is beyond your control.
You wouldn't really want a user to have to resort to this anyway. Are you trying to display the image in isolation? In which case create your own 'image view' page or show it in a lightbox or something.

Related

Is it possible to add custom background image for carousels on Google Assistant Actions?

I am developing an action for Google Assistant and I want to know what I can on Smart Displays. In Google's own video, upon user input, the app shows carousels and if the user clicks any one of the carousel items, a new screen with a different background image opens.
When I dug in to see how we can do that, all I could find was a single general background image in the app setting. So my question is how can I change the background image depending on the user-input?
Google's styling options (incl. background image) for Actions on Google can be found in the Theme customization tab in the Actions on Google console. Please note that if you define a theme for your project, rich responses across your project's Actions will be styled according to your theme.
Background image will use a custom image in place of the background color. You'll need to provide two different images for when the surface device is in landscape or portrait mode, respectively.
Reference: https://developers.google.com/actions/assistant/responses

clickable images on mobile

On a desktop, if I make an image a link, I can make the mouse change to a pointer to indicate that the image is clickable. How do people normally indicate a clickable image on mobile since there is no mouse?

make a background image clickable without making contents clickable

I desperately need to make the background image of a site clickable, but I don't want everything (i.e. the contents of the site) to be clickable. how do I make it so that just the background image clicks to a website with making the contents click to that website as well.

Immediate Save Dialogue to Download HTML5 Canvas Image - Not Saving on Server

I am working on a purely JS/HTML page where the user can upload an image and the image is converted to canvas data and displayed. Then the user can click on a button to have alterations performed to the pixel data, changing the display.
Now, if the user wants to save the image they can right click and do a save as and they are prompted to save the image as canvas.png; I would prefer, however, to just have a button "download image" that the user can click to pop up the standard save dialogue box.
My question is how can make such a button, that pulls the canvas data into a standard image download prompt?
Here are some more details:
If you do a "view image" on the displayed image the url it goes to is like this:
data:image/png;base64,iVBORw0KGgoAA (lots more stuff)
Jacob Seidelin, has created a library that allows you to save the canvas as an image. You can find his site here!

Why doesn't my image color match background color in FireFox?

I think I could be doing something wrong in photoshop. I'm trying to create a banner for my website.
I created a new image in photoshop, then filled the background with a color I picked #E06205
I then saved the image as a jpeg.
On my webpage, I created a div and gave it a background color
background-color:#E05206;
When I open the page in Safari and Chrome it's beautiful. Matches perfectly.
However, when I open the page in FireFox, the colors don't match. I can't figure out why that is.
By the way, this is definitely a problem with the image I created. When I compare the same image side by side, Firefox gives me the 'wrong' color
Your issue is in the color profile you are using for the image. Make sure when you save the image you use Save for Web & Devices…
To read more if you want you could travel to this website:
http://css-tricks.com/color-rendering-difference-firefox-vs-safari/
You should save your images with "Save for Web & Devices" option of "File" menu in Photoshop. You can get many options and image types in this option as per your requirement.

Resources