ansaurus

Question

jQuery load() and stylesheet not working?

Answer 1

A:

Is the stylesheet referenced in the head element of the file being loaded? If so, it won't be loaded by load because load silently filters everything but the content of the body element. If you include the stylesheet in the document from which the script runs and into which the other document will be loaded, it should work just fine.

<head>
<link rel="stylesheet" type="text/css" href="styles.css" media="screen />
...
<script type="text/javascript" src="...jquery.js"></script>
<script type="text/javascript">
$(function() {
    $("a").click( function(e) { 
        $("#Display").load('file.html');    
        $("#Display").show();
        return false;
    });
});
</script>
</head>
<body>
<p><a href="#">Load Content</a></p>
<div id="Display"></div>
</body>

tvanfosson 2010-08-20 10:53:18

The stylesheet is embedded in main index.html file where jQuery functions are. So I guess everything is correct?There's no head section in loaded document since it's not a whole document, but only a few paragraphs of text (something like PHPs including).

aldona 2010-08-20 11:28:47

It should work then. Is is possible that other styles are overriding them? Have you checked with Firebug to see what rules are being applied after the document is loaded?

tvanfosson 2010-08-20 15:32:25

ansaurus

tags:

views:

answers:

jQuery load() and stylesheet not working?

related questions