Just learning to code. And would like to know why my images aren't showing on my browser(s). Both Firefox and safari. I'm using an iMac computer (which is not a problem anyway).
Here is an example of the code:
<img src="images/fish08.jpg" alt="Big Fish" width="250" height="200">
Something must be wrong with your source path. Your code should work if this is your folder structure:
- fileWithImageElement.html
- images
- fish08.jpg
Please read HTML file paths to see which one you should use.
Related
I uploaded an image to my web server just like all the images are. I created it in Photoshop and exported to a .png. The image resides under The code is src="" But the browser shows that the image does not exist. I've set permissions to 0777, I've changed the image path, tried a different image in the same path to confirm it's reading the path right, and the image will just not show. You can view the link here, it will show nothing
EDIT: This is what the image is suppose to look like
EDIT: Removed links for privacy
You forgot " at the end.
It should be like this:
src="img/SccBridgeLogo.png"
OR
Try adding / at the beginning of the path, that should tell the browser to search from index directory.
src="/img/SccBridgeLogo.png"
Note this only works if you are running on a site, running from index.html in browser will return in
File:////
I had to use the picture tag for fallbacks and came across this issue at that point.
This use to work fine
<img src="images/netgraph-logo.png" alt="NetGraph Logo">
After adding the picture tag
<picture>
<source srcset="images/netbob-logo.webp" type="image/webp">
<source srcset="images/netbob-logo.png" type="image/png">
<img src="./images/netbob-logo.png" alt="NetBob Logo">
</picture>
In my case I was able to go down one folder from the root folder, therefore "./" preceding the rest of the url worked fine. You may need to back up several folders instead though, so be sure you are using the correct type of path.
So i have uploaded my website in godaddy and some of my
small images are displaying (sizes: 872 × 546px) but the large ones aren't displaying (the banners that has a size of 2700 × 900px). Does anyone know why this is happening?
This here shows when i check why my banner image wont load. Ive tried using already but it still doesn't appear
edit: They are both located in the same folder
for the large images:
<section class="banner">
<img src="img/WhyHim_Header.jpg" alt="whyhim" class="img-responsive">
</section>
for the small images:
<section class="polaroidimages">
<img src="img/Image2.jpg" alt="Image 2">
</section>
Can you provide more details? Normally this kind of errors are related to either the path you have specified or the file name? Have you made sure the file name and extension are correct?
Check your file sizes -- per GoDaddy's documentation, images must be smaller than 30MB. Also, images larger than 1920 x 1080 may cause problems. If your filepaths are correct, this is likely the issue.
I have the following <img> tag in a static HTML document.
<img src="foo.gif" alt="This is an animated gif image, but it does not move"/>
After I set its src attribute to point to a .gif file (i.e. foo.gif), the GIF appears as a static (or non-moving) image. How do I animate the GIF?
By default browser always plays animated gifs, and you can't change that behavior. If the gif image does not animate there can be 2 ways to look: something wrong with the browser, something wrong with the image. Then to exclude the first variant just check trusted image in your browser (run snippet below, this gif definitely animated and works in all browsers).
Your code looks OK.
Can you check if this snippet is animated for you?
If YES, then something is bad with your gif, if NO something is wrong with your browser.
<img src="http://i.stack.imgur.com/SBv4T.gif" alt="this slowpoke moves" width="250" />
Agreed with Yuri Tkachenko's answer.
I wanna point this out.
It's a pretty specific scenario. BUT it happens.
When you copy a gif before its loaded fully in some site like google images. it just gives the preview image address of that gif. Which is clearly not a gif.
So, make sure it ends with .gif extension
try
<img src="https://cdn.glitch.com/0e4d1ff3-5897-47c5-9711-d026c01539b8%2Fbddfd6e4434f42662b009295c9bab86e.gif?v=1573157191712" alt="this slowpoke moves" width="250" alt="404 image"/>
and switch the src with your source. If the alt pops up, try a different url. If it doesn't work, restart your computer or switch your browser.
I cant work out why my iframe is not displaying correctly. There is lots to be done with it in terms of customization etc still but it isn't even displaying for some reason. I recently had SSL integrated. Here is the URL for the site where it is not displaying:
https://www.guildinator.com/domains.html
It should look like this:
http://guildinator.com/instantdomain/
The code I am using is
<iframe src "http://www.guildinator.com/instantdomain/" width="200" height="200"></iframe>
I know the width and height are weird but it was just to initially get the iframe in(eventually i want to turn it into a dynamic iframe). But I just can't work out why the iframe isn't displaying with such a basic code.
Thanks in advance for any help
i thinks you missing = in src
<iframe src="http://www.guildinator.com/instantdomain/" width="200" height="200"></iframe>
I just switched the site from my working files to the server.
It worked fine when I uploaded it to my portfolio but once it was on the correct domain it stopped working. The image, instead of displaying, just shows up blank so I tried going to it's direct url.
Instead of it working it downloads the image instead of displaying it.
Here is the direct url: Direct url
My tag: <img src="images/login_header.svg" alt="Alright, lets start finding discounts!" />
My structure:
// root (BBCM)
//// images
////// login_header.svg
//// css
//// js
// end root
I have tried:
/images/url.svg
the direct url for the image
BBCM/images/url.svg
It works fine when it's on my portfolio but not on the correct domain.
Any ideas? When the image downloads it also displays the correct image so I am a bit lost here.
Is your server sending the .svg file down with the correct MIME type? It should be image/svg+xml.
See Nginx offers of downoload SVG instead of showing it for another question along the same lines.
Some browsers don't allow the IMG tag to support SVG files, you can however put it in an object with an image as fallback in case the browser fails to render.
<object data="image.svg" type="image/svg+xml">
<img src="fallbackimage.jpg" />
</object>
try use <object data="/images/login_header.svg" type="image/svg+xml"></object> instead