Not familiar with corners, but the problem is that you're applying
corners before the div called "differentcorners" exists.
The line $("#differentcorners").corner("tl 8px").corner("tr br 8px");
is being executing once the page is loaded - it searches for the div
called 'differentcorners', but at the time the page has just finished
loading, it doesn't exist yet. Then at some later time, you're making
an Ajax call (why don't you use the jQuery ajax functions??), and then
at some still later time you receive the response and put it into the
'insert' div. This is well after you've tried to apply corners.
Try the following:
$('button#test').click(function() { // modify to be whatever event you
need
$('#insert').load('externalData.php', {}, function() {
$('#differentcorners').corner("tl 8px").corner("tr br 8px");
});
});
What this does is
1. Attach a function to event that...
2. Loads some data into a div called 'insert'...
3. And on completion of loading the data, applies the corners
Modify the first line so that it is attaced to the appropriate event.
Look up the .load function at docs.jquery.com for more info on the
parameters (ie, if you need to send the externalData page some
parameters.
On Jul 12, 3:42 pm, shaf <[EMAIL PROTECTED]> wrote:
> Hi Guys
>
> I am using JQuery and a rounded corners plugin to round the edges of
> my div IDs. I have an index page and use innerHTML to inject HTML into
> the index page. The problem is the HTML which is injected into the
> index page, the div tags which are supposed to become rounded remain
> unchanged. See code below:
>
> index.htm:
> [HTML]<head>
> <script type="text/javascript" src="js/jquery.js"></script>
> <script type="text/javascript" src="jquery.corner.js"></script>
> <script type="text/javascript">
> $(function() {
> $("#differentcorners").corner("tl 8px").corner("tr br 8px");
> });
> </script>
> </head>
> <body>
> <div id="insert"></div>
> </body>[/HTML]
>
> AJAX:
> document.getElementById("insert").innerHTML = xhr.responseText;
>
> HTML being injected into index.htm:
> <div id="differentcorners">welcome</div>
