Home/ Questions/Q 7971855
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T07:43:30+00:00

When loading a CSS/JS file from CDN or any external server, it is possible

  • 0

When loading a CSS/JS file from CDN or any external server, it is possible (even with low probability) to miss the file due to external failure. In this case, the html page will be corrupted in the lack of appropriate CSS and JS.

Is there a practical approach to load a local version upon CDN failure?

<link rel="stylesheet" href="http://cdn.com/style.css" type="text/css" />
IF (not loaded style.css){
<link rel="stylesheet" href="/css/style.css" type="text/css" media="screen" />
}

It would be easier to do this for JS, as we can test a JS function (provided in the JS file); then, loading the local file upon failure. For example, testing, if jQuery library is available.

However, I am curious to know if there is a practical method for this!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I would do it this way.

    Create a class within your stylesheet ui-helper-hidden and then add a div as the first element on your page;

    <body><div class="ui-helper-hidden"></div><!-- rest of html --></body>

    After you have checked to make sure your CDN javascript file has been loaded, then use this bit of code note i am using jquery

    <script>
    // CSS Fallback
    $(function () {
        if ($('.ui-helper-hidden:first').is(':visible') === true) {
            $('<link rel="stylesheet" type="text/css" href="/pathtocss/nameofstylesheet.css" />').appendTo('head');
        }
    });
</script>

    This will check to see if the element which should be hidden is or not. If it isnt hidden, then you know your css file has not loaded from the CDN.

    I use this method for jQuery and jQuery UI via a CDN

    • 0