Images published from GitHub Pages not displaying correctly - html

I am publishing some simple webpages (HTML, CSS, some JS) from my GitHub repository. When I display index.html in Chrome (55.0.2883.95, 64 bit) by clicking on the URL linked in this repository, the webpage is displayed, but as soon as I scroll down, the featured image disappears when it shouldn't.
The other working link is "Fees" at the top. Click on that, scroll up and down the page, and the featured image will similarly disappear.
I want to point out that I first published this repository/page in Nov. 2016 and the images all displayed fine. Recently I changed the domain name associated with the repo but normally wouldn't expect this to create issues. Also, when I simply zip and download the repo and open in Chrome locally, everything displays perfectly.
Lastly, this site works with CSS Grid so I have the appropriate flag enabled in Chrome. It's hard for me to understand why images suddenly don't display correctly using GitHub Pages!
EDIT Sorry if this question seems vague. Let me restate. Everything seems to initially load and display correctly in my browser. The issue seems to be triggered by merely scrolling down the page.
This code used to display correctly on GitHub Pages. I come back two months later and the same code doesn't work anymore. Image pathnames are all correct. It's evidently not a JS issue. Download the same code and it displays perfectly on localhost.

After reading this thread I realized that one of my extensions was causing the page to disappear on scrolling. Specifically, I disabled the Window Resizer extension and the problem was solved.

Related

Why is my published website deformed when my unpublished version of the same website perfect?

so I have created a webpage using html and css called https://www.printt.us. When I run the code before I publish it, it looks fine. However, when I publish it, it is completely deformed. This is not a local issue because it affects a lot of other people that have viewed my webpage too. Does anyone know a fix for this?

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.

Loading and unloading widget on wordpress site - possible css error?

I am developing a science wordpress website and I am having an issue with a widget. When I load the page the widget quickly loads and then disappears.
This only happens in Chrome and Firefox, and not Explorer for some reason.
It is EXTREMELY strange as this widget was working perfectly for a while, and after changing nothing it stopped. I have disabled all plugins and it still does not work. I even restored my website from a backup when it was for sure working -- still nothing.
A page of the website with the issue (just dummy content) is located here:
http://scientized.com/physics-astronomy/
As one can see it quickly loads the image slider:
Then unloads the image slider:
Any ideas?
EDIT: it appears the problem is intermittent. Please refresh a few times to replicate it if you don't see the error on the first load.

Changing favicon of Jekyll blog hosted on Github Pages?

I used the jekyll's template Left by holman which had a favicon in the files but now I am unable to change it in my browser. I have replaced the favicon with mine but the change doesn't occur? I have also switched to a completely new template but its still there? My site is naumanahmad.me
Like Nitsan Baleli (who commented on the question), I'm also seeing what looks like a cartoon version of Iron Man under http://naumanahmad.me/favicon.ico
(the same image that's displayed in the top left corner of your site).
If you are seeing the old icon instead, it's probably in your local browser cache.
Try to delete your cache, or reload the page ignoring cached content (Ctrl+F5 in most browsers), or load the page in a different browser where you never loaded it before, to make sure the browser loads the current content from your site instead of an old version from the cache.

Page changes not displaying on my computer only

I have come across a strange issue with my company's site, and it seems to only affect my computer. Changes that I have made to the raw HTML are not reflected in my browser (Firefox).
I have taken the following steps to resolving this issue, without any luck:
Ensured that the page was uploaded successfully to the correct directory (downloading the file from the server shows that it is the same file as the one just uploaded).
Cleared my browser history and cache, refreshed the page.
Opened the page in other browsers (IE, and Chrome).
RDP'd into our server and opened multiple browsers that way.
A colleague of mine sits directly across from me and he has opened the page in the same version of Firefox that I typically use and he can see the changes. He and I both work on the site regularly.
The strangest part is that I have made changes to this page before, and they showed on my screen instantly. These changes are still in place and visible, yet some HTML elements that existed before I made those changes do not show on my screen currently (despite still existing in the HTML).
Has anyone else ever experienced such a phenomenon? Is there anything else that I can try in order to resolve this issue?
Have you tried forcing cache refresh? Try it by clicking Ctrl + F5