Simple jQuery code works fine until site is loaded via https://

Question

I have a simple peice of jQuery code that submits a form and hides/shows some on screen information. It works fine when tested, until loaded via https:// upon which it breaks in IE7. It appears to break totally, with none of the script having any effect. I also get the IE warning that "some elements are insecure".

Does anyone have any experience of this happening? Or even better, a solution! I have to load the page via https as its a credit card payment page.

Answer 1

The three previous answers all mention the problem of a secured "https" page trying to include scripts or other resources (stylesheets, images, etc) from an "http" path...

I would like to add to these, and note that if you have a situation where the same pages could be loaded via either http or https, then you can create "protocol-less" URLs---the protocol will be assumed to be the same as the current page. Note this is only needed for accessing resources on different domains (and will only work if those different domains support both http and https), because obviously if you're accessing resources on the same domain, you don't need to start with http:// at all...

For example, each of these three resources would assume either http or https depending on how the current page was accessed:

<script src="//www.example.com/whatever.js" type="text/javascript"></script> <img src="//www.example.com/someimage.png" alt="whatever" /> <link href="//www.example.com/styles.css" rel="stylesheet" /> 

Answer 2

If you serve a page via https:// then every resource link should also use https://. Look out for

<script type="text/javascript" src="http://.../jquery.js"></script>