.png images display in IE8 alone but not inside a page - html

It's been a while since I did serious web development. Now I meet a host of brand new problems I'm no longer familiar with..
I have some .png images for various icons in my web page. What I find is that whenever I edit these images, they stop working inside a page in IE8. That is, they (usually) display OK when I first open the page, then are replaced by the placeholder icon on refresh. Sometimes, some of the icons display and others, with the same src, don't.
My image tags are nothing fancy, typically:
<img src="images/misc/smallreport.png" alt="Report" />
When I right-click an icon in the page and select "properties", protocol, type, address and size are shown as "Not Available", and dimensions are incorrect (size of the placeholder, I bet).
If I open the images directly in IE (ie. not within the page), they work just fine.
I have used Paint.NET to edit the images, but have also tried saving them with Paint.
Right now, I am working right off the hard disk (ie. not through a web server). And, oh yes, none of this happens in Google Chrome.
What's going on here?

check the path to the file is correct - can we see the tag please.

Well, we learn something new every day..
I mentioned that I'm running this directly off the harddisk? Now, it turns out the html page (which I had gotten off a coworker) was blocked "to help protect my computer", as Windows does.
This is no big surprise, lots of files I'm working with originate on other computers, and I usually don't worry much about it (except with executables, which won't run until unblocked).
It seems, however, that when IE8 loads such a blocked HTML file, its security settings adjust somehow, and - well, I can only guess at the details, but as soon as I right-clicked the HTML file, selected Properties and clicked the "unblock" button, the problem went away.

Something similar happened to me once, I tried hard to find what was wrong, then I realized I was saving (from Photoshop) the file as PSD but with extension .png. Make sure you're not doing the same.
Also:
Clear temporary Internet files
Verify that the Show Pictures option has not been turned off
Make sure that the Toggle Images.exe Web accessory is not present and disabling images
Make sure that a third-party Internet security, firewall, or cookie-blocking program is not causing the problem
Enable the Auto-Select encoding option
Source

It might be that the website you have browse has a lack of support
for an IE browser. IE is a nightmare for all web developers & Web designers.
It might be the developer of that website didn't care for an IE display because
of IE issues. Perhaps IE is trying to create a web standard to increase their
sales and marketing strategy. That's why don't care the modern Web development standard.
Why Chrome or Firefox or Safari, it's a free anyway.

Related

Why Is My HTML and CSS Code Not Running Properly On The Internet?

I recently added some text effects to my website in HTML and CSS. It runs perfectly on VS Code live sever but whenever I upload the code files on to my cpanel, the effects just seem to go away when I actually click and go on my website and I am not sure why. Does anyone know a fix for this? Here is my website julianwsanchez.com
And this how it is supposed to look:
How It Looks When I open it:
The output I'm seeing on your site matches the output of the code snippet here, effects and all.
Check to see if you have some browser extension that affects the way a site might look (e.g. a dark mode extension). Also, try going to your site in a different browser and/or in Incognito mode.
it Works for me just fine, both the link given, and the files running on localhost
You might need to do a hard reload.
try Ctrl-Shift-R on chrome when viewing the page.
This clears the browsers cache for that webpage,
alternative: open the web page in another browser.

My website always looks janky for the first little while when I first upload a change

So I recently updated my online portfolio, just a few minor changes to the design, it looked great in browsersync, then when I upload it, it looks horrible. It's like some of the CSS isn't being read. I can't figure it out. When I view it in an incognito browser, it looks just how it is supposed to - knowing that, I cleared all my cookies and data and still nothing changed. I'm new to web development, and this really boggles my mind. Does anyone know what is causing this?
Web browsers tend to locally save a version of the css so they don't have to request it from the server each time you visit the page which speeds up the load time. Try hard clearing the cache for your portfolio page then try again.
modern development tools like Chrome's web inspector can turn off caching and request the entire page from the server each time, that might help you.
Could possibly be that your browser is imposing it's default-styles onto your project, or more than likely that an addon/extension is changing your browsers' ability to display your CSS. I would suggest running through your extensions and see what could be causing it, or to quickly troubleshoot, download and install another browser and leave that clean (as in no additions) and use that to test.

Caching? div concerning images don't work on pc's that opened site first 3 hours after upload

Hi I'm kinda stuck on idea's to try to solve my problem since I don't have much experience concerning caches.
I'm currently working on this site of a business partner of me.
I got his host, username and password so I'm litterary working as him using Filezilla.
I downloaded the entire site content from filezilla into a desktopfolder.
I made a copy of it to work in and from there I made some changes in the .html and .css files.
In offline mode, everythings works perfectly as I want it.
Then I deleted the the sitecontent in Filezilla and replaced it with my changes.
Now the weird parts happen.
When I open the site online without www. prefix it works great
when I open the site online with www. prefix I can't see the images that are
placed within div's that purely concern the image
When a pc opened the site in the first 3 houres it was online, the div's don't
work
Also later on that specific pc can't make the div's to work
Pc's that opened the site only after these 3 houres have no problem at all
I've tried replacing the stylesheet and wait a couple hours, but caches seem to be made. and the result stays the same.
However this is no problem for the avarage customer since for them the site works, you can see what a hell this may be for me as developer and the owner, who offcourse opened the site right after I put it online.
Any suggestions might be usefull.
In most of the browsers you can use F12 shortcut to see the developer tools. In Network tab you can see all files that are currently being loaded. You can see there if the file is being loaded from the server or from the local machine.
By pressing CTRL+F5 (in Chrome and think in Firefox too) you are forcing cache to refresh.
If the PC is still loading in a cached version of the site, you can refresh the page and delete the cache by holding Control + F5.
Seems like I found the source of the problem.
I was using the css from a bought template which has some coding that malfunctions when ftp-uploading using ASCII
Uploading Binary solves the problem
The reason the did work on some computers was that they had the old css still cached. which was earlyer uploaded in binary instead of the same css files i uploaded in ASCII.

WebGL in Chrome works second time but not first time

WebGL does not work in the following three scenarios:
(for the 'test webgl' site used get.webgl.org)
1 Start chrome, Google search for the 'test webgl' site, click on the link in the search result.
2 Go to the 'test webgl' site from a link in an email.
3 Start Chrome from a short cut or command prompt, "C:\Program Files\Google\Chrome\Application\chrome.exe" http://get.webgl.org/
This only happens when Chrome is not already running. In other words WebGL does not work when chrome starts up. However it does work if chrome is already running.
The best demonstration is scenario number 3, above. This starts chrome and goes to http://get.webgl.org/ and Webgl does not work. Then do exactly the same again but this time with chrome already open and Webgl works.
Would very much appreciate feedback or a solution, thanks.
Have also created various test sites in html, javascript and webgl, in order to find a work-around. For example if webgl is not available then allow the user to click on a link to open the page in a new tab, this does not work. However if the user opens a new tab then loads the page, webgl is detected and works.
In short, if a customer opens chrome and searches for your website (that has webgl content). Then clicks on the link, webgl will not work. It does not seem reasonable to then instruct the customer to open a new tab and then go to the same website a second time. So far have not been able to find a solution so that it just works without the customer having to fiddle around.
I realize that this may be a chrome issue as it does not occur in firefox, however am trying to find a javascript solution rather than waiting for chrome developers to fix it.
Thanks for any suggestions.
(Windows XP Pro, Chrome V36)
Hi Mack,
Thanks for your reply. The majority of visitors to my web site have XP and Chrome. I should imagine that this is true for quite a lot of peoples, websites.
Problem 1 The first fallback I had on my website was to detect if webgl is supported. If yes then continue as normal. If no then display a help page. This was simple and worked, however, google crawlers do not handle the javascript very well, therefore always index the webgl help page, rather than the home page.
Solution 1 Managed to fix this by having a popup box appear when webgl is not supported, giving the user a choice of whether to continue or go to the help page. The conditional code that processes the user response is arranged so that if the user is a google crawler then it simply 'falls through' and displays the html content of the home page, and not the help page.
There are lots of web sites that seem to have this same problem, including get.webgl.org, in other words, if you do a google search for a website, and that site contains webgl detection and fallback code, the search result always shows the fallback content, rather than the authors intended main content.
Problem 2 Now that I finally have the home page listed correctly by google, found that am still losing many customers, as they are starting chrome, searching google for my site 'suit yourself shirts', clicking the link in the result and being told incorrectly that webgl is not supported.
Am very interested in your solution but do not quite understand how it works. Have tried detection then page refresh or load the page in a new tab or display a link for the user to load the page, but none of these methods seem to work. Seems like quite a fundamental problem that would effect many webgl websites. Would be very greatfull if you could explain your suggestion a little further. Thanks for your help, kind regards - Gary

link to local disk

Is it possible to put a html link on a page that opens a file in local disk?
Like c:/myFolder/myfile.xls
This page is not actually going to be on web, but this feature would be needed for demostration purposes only. When the page is on web, the file is too, and link has url value.
You could use
my link
Be wary that this may not work for all browsers (ie firefox) due to security reasons (See here) and it certainly wont work for other people accessing the webpage.
This would be a risky thing to do. As not everybody uses a PC, it will be different for a mac and a linux than a PC. Also not all browsers allow you to do it, such as Firefox, it dis-allows it due to potential security risks. But anyway here's the html code if you still wish to do it:
Click Here
You want to use the file: scheme.
file://C|/myFolder/myfile.xls
Tried it, but link does not open a thing. Sorry, I could not put this as a comment. Please edit.