I am using a jQuery CSS style on the main portion of my website. It works fine. Now, I also have a sub-directory of my website which should not use the style. When I manually navigate my browser to the sub-directory of the website, no style is applied which is what I want. When I click on a link to the sub-directory from the main area, however, it is applying the CSS style from the main part even though I am not referencing this CSS anywhere in the HTML of that sub-directory. If I refresh the browser, the style goes away.
Please can someone help me understand what is going on here? Thank you.
You are using jquery mobile, which by default loads the content of links via ajax. That means you don't have a page refresh when clicking on a link. The contents get dynamically inserted in your document which still has all your css.
More information here.
http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html
You have to disable ajax for that link. More information here.
jquery-mobile - how can I bind disable ajax links to a certain class
Clear your history and browser data, then refresh and try.
Try to open the link in chrome and using the developer options (F12)
look for the resources it is referencing. If the page is referencing
the CSS files then either Javascript is making the referencing or
you have accidentally kept the resource link. Let the forum know your findings.
Edit
Somebody seems to have done what I have mentioned and has come to conclusions that they are because of AJAX. The steps I have mentioned above would let you do that all by yourself.
Related
I'm working on an assignment for a class where our teacher has given us a webpage built out with html and css. We are eventually supposed to create some animations with gsap, but first need to make our own edits to the webpage itself. I am using vscode and when I edit any of the html, the changes show up in my index.html, but not in the browser. Any idea why this is?
try to right click your browser and check in the sources to make sure it really saved your changes.
Try to use live server on VS Code and then whenever you save it will show up on the page.
-> https://techstacker.com/local-live-server-vscode/
Make sure you save the file and reload the page in the browser
How to change the html code in chrome:// pages, for example, a page that has no internet, how do I modify the main code so that even if I enter the page again, the changes remain
Example:
https://images.app.goo.gl/eq5XGEu2f54TWqcf9
unfortunately, there is no way to change this. a page embedded in an exe
you can use chrome plugins to change the page style.
https://chrome.google.com/webstore/detail/stylish-custom-themes-for/fjnbnpbmkenffdnngjfgmeleoegfcffe
I'm trying to add a custom style on a product page in the Pinnacle Cart CMS. I've tried adding a <style> tag through the Source Code button in the content editor. Yet, it seems that <style> tags get destroyed by the CMS once you save your page. I'm not sure how else to inject custom CSS into a product page.
The only possible alternative that I see is that maybe I could apply the CSS globally, though the CSS system in Pinnacle Cart. Unfortunately, that could obviously cause problems in other pages wherein the CSS may apply to elements for which it is not intended.
EDIT:
I have also tried the following: going to "Cart Designer" for my site, going to the page in question, clicking on Advanced Tools, and then clicking "Edit custom css". However, when I do that, it seems that the CSS is not saved properly. If I check the custom CSS for that page, it shows up in the source editor. However, the custom stylesheet with my rules does not get served by the server when I request the page.
My problem is that I linked the CSS correctly when I created my HTML file, but then when I try to edit the CSS the other day, it just didn't update my HTML file and I did save it of course. One way I can get around this is by deleting the CSS in my htdocs and creating a new stylesheet with the exact same contents then linking the new one to my HTML. Can you guys tell me why is this happening and how can I prevent this from happening again?
I think that the problem is with cache. You can try running the site in an incognito/private window of your browser.
You can also inspect the page and see if the new styles are loaded. You can also try Empty Cache and Hard Reload option when you right click the reload button on chrome browser while inspecting.
one way you can prevent it is by doing all your css in the actual html file like so
<head><style></style></head>
I have a code snippet that is installed on third party websites. I can't get into the details, but it loads HTML, CSS and JS onto the page through the use of a <script> tag.
Part of the code is a JS function that executes when this link is clicked:
?
If there are JS errors on the page that prevent the function from executing, clicking the link obviously just adds the hash to the URL and takes the user to the top of the page. This is the expected fallback behavior.
However, on one third party site with a multitude of JS errors, clicking the link removes everything after the top level domain, adds the hash, and directs to that page (the home page). For example, the link would take the user from:
http://www.example.com/2010/05/14/very-interesting-blog-post/
to
http://www.example.com/#
Notably, the issue occurs in Firefox and Chrome, but not IE9. I know it may be impossible to properly diagnose the issue without more detailed code, but I'm not at liberty to provide it. I'm just hoping to get some kind of reasonable explanation for this strange browser behavior.
If it helps at all, the site in question is a WordPress blog. Thanks in advance.
EDIT: This is apparently not caused by any JS on the site, because turning off JS and adding the link with the inspector produced the same behavior.
I had a similar error where clicking on any <a href="#"> causes a full page reload. I managed to solve this by removing the <base href="/"> tag from the <head> of the page. I couldn't find any informations on this (yet). I'll add more if I can find any additional info.
This problem happens when you use windows.onpopstate to handle back or forward buttons and load page using ajax. Try to solve your js code for handling history.