开发者

Not sure why this isnt loading content via AJAX in IE?

Creating this simple AJAX Based WordPress theme and Ive created a custom lightbox for it. All is going well but the dreaded IE has now set into play.

For some reason the content isn't loading in IE (only tested IE8).

First off, her开发者_如何转开发e's the link to the theme thus far: http://themes.thefinishedbox.com/portfolio/ bare in mind it's still in early stages so will look even worse in IE anyway.

Click the bottom right icon on the image hover.

The class .postExpand contains the permalink to the post, while the ID #postEntry is what I load via AJAX.

Here's the jQuery for it, if you want a better look you can see the raw file here: http://themes.thefinishedbox.com/portfolio/wp-content/themes/portfolio/js/custom.js

$(function() {
    $('.postExpand').click(function(e) {

        e.preventDefault();

        $.ajaxSetup ({  
            cache: false  
        });

        var href = $(this).attr('href');

        var loader = "<div id='loader'></div>"; 
        var loadurl = href + ' #postEntry';

        $('body').prepend('<div id="overlay" />');
        $('#overlay').animate({opacity: 0.8}, 400);

        $('body').prepend('<div id="lightBox" />');

        $('#lightBox').html(loader).load(loadurl, function() {
            $('#postContent').jScrollPane();
            $(this).css({backgroundColor: '#fff'});
        });

        $('#closeBox > div').live('click', function() {
            $('body #lightBox').remove();
            $('body #overlay').animate({opacity: 0}, 400, function() {
                $(this).remove();
            });
        });

        $('body #overlay').mouseup(function() {
            $('body #lightBox').remove();
            $(this).animate({opacity: 0}, 400, function() {
                $(this).remove();
            });
        });

    });
});

I believe the problem lies with the var loadurl as I can change that to 'http://themes.thefinishedbox.com/portfolio/' and it will load.

Anyone have any ideas what the problem may be?

EDIT

This doesn't work either:

var href = $(this).attr('href');
var loadurl = href;


Your loadurl statement has a space too many:

var loadurl = href + ' #postEntry';

versus

var loadurl = href + '#postEntry';


Problem was the permalink structure, possibly a bug with WordPress 3.1 in IE.

It was display /category/ in IE when it shouldn't. Since the theme doesn't require categories I stripped the permalink structure to just /%POSTNAME%/ and it resolved the issue.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜