asfar,lautr

Entire page is re-inserted within #content

I'm assuming I'm missing something, but in the basic implementation in a page with a #content div I do get an ajax reload, but I get the entire request page loaded in to the that div, not just the corresponding #content section. Is there an obvious reason why this would happen? I figured the idea was that if #content is the target it would also look for and load only that div from the request page.

Stop jQuery from cycling

I have arrows for pagination that link to the next/previous pages. However, because I am using Ajax, jQuery still cycles the slide effect even if there are no other pages to be viewed. Is there a way to stop that?

Additionally, if I have 3 pages worth of articles, the paginated arrows will only link to the first and last page. Is there a way to solve this? I tried putting them inside #ajax however, ajax kind of fails.

By the way, I had to create two pieces of code to get the slide effect to work.

Live example: http://chrisburton.me/dev

$('#ajax').asfar({
      selector : '.l-arrow',
    before : function(urlFragment,target){
        console.log('before');
    },
    insert : function(urlFragment,target,data){
        $(target).hide("slide", { direction: "right" }, 500, function(){
            $(target).html(data);
            $(target).show("slide", { direction: "left" }, 500);
        });
    },
    after : function(urlFragment,target){
        console.log('after');
    },
    success : function(urlFragment,target){
        if(0 > $('a[href="' + urlFragment + '"]').length){
            $('a').removeClass('active');
            $('a[href="' + urlFragment + '"]').addClass('active');
        }
        _gaq.push(['_trackPageview',urlFragment]);
    }
});


$('#ajax').asfar({
      selector : '.r-arrow',
    before : function(urlFragment,target){
        console.log('before');
    },
    insert : function(urlFragment,target,data){
        $(target).hide("slide", { direction: "left" }, 500, function(){
            $(target).html(data);
            $(target).show("slide", { direction: "right" }, 500);
        });
    },
    after : function(urlFragment,target){
        console.log('after');
    },
    success : function(urlFragment,target){
        if(0 > $('a[href="' + urlFragment + '"]').length){
            $('a').removeClass('active');
            $('a[href="' + urlFragment + '"]').addClass('active');
        }
        _gaq.push(['_trackPageview',urlFragment]);
    }
});

Does not apply 'active' class

For whatever reason when I go to different pages, it does not append a class of active to the menu link. It just highlights the link that you land on.

Note: I am using the default Kirby installation.

lautr / asfar Goto Github PK

asfar's People

Contributors

Stargazers

Watchers

asfar's Issues

Entire page is re-inserted within #content

Stop jQuery from cycling

Does not apply 'active' class

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent