draxq02664 2015-04-03 21:40
浏览 216
已采纳

使用ajax进行HTML重定向

Working on a website that uses Ajax - http://jasonanarchy.com

I'm trying to get the boxes that hold the images to redirect to their respective websites. (the domains that show when you hover)

Here is the code to one of the box elements:

<a href="http://anarchyplants.com" class="element element-portfolio portfolio ajax">
        <input type="hidden" class="order" value="2">
        <img src="/img/portfolio/aplants.jpg" class="portfolio-image" alt="portfolio image"/>
        <span class="portfolio-title"><i class="icon-play"></i>Anarchy Plants
        </span>
    </a>

My guess is the "Element" call is what makes the box do it's funky ajax thing, but if I remove it, it breaks the box. What would I have to change/edit to get it to work?

I want to keep all elements of the ajax, but have it so when you click it, you actually go to anarchyplants.com

AJAX CLICK LINK:

/* 
     * Ajax link click (mainly for portfolio items but any content can be linked to) 
     */

     $('.ajax').click(function(e){
         e.preventDefault();
         var page = $(this).attr('href');
         $('.container-footer').fadeOut(199);
         $('.last-scroll').val($(document).scrollTop());    //current scroll posn to return to later
         $('html').append('<img src="img/loading.gif" class="load-gif" style="z-index: 999"/>');
         $('.load-gif').css({
                position:'absolute',
                left: ($(window).width() - $('.load-gif').outerWidth())/2,
                top: ($(window).height() - $('.load-gif').outerHeight())/2
            });
         $('#container-isotope').fadeOut(200, function(){
         $.get(page, function(data) {
              $('.load-gif').remove();
              $('.ajax-content').html(data);
              $('#container-isotope').stop().hide();
              $('.container-footer').fadeIn(599);
              $('#container-ajax').fadeIn(600, function(){
                  $('.close-ajax').show();
              });
              window.scrollTo(0,0);
            }); 
         });
     });

     $('.close-ajax').click(function(e){
        e.preventDefault(); 
        $(this).hide();
        $('.container-footer').fadeOut(199);
        $('#container-ajax').fadeOut(200,function(){
            $('#container-isotope').fadeIn(600);
            $('.container-footer').fadeIn(599);
            window.scrollTo(0,$('.last-scroll').val());
            $container.isotope();
            $('#container-ajax .ajax-content').html("");
        });
     });

Any and all help will be greatly appreciated! - Cheers!~

  • 写回答

2条回答 默认 最新

  • drktvjp713333 2015-04-03 22:03
    关注

    Remove this from the <script> section at the bottom of the page:

    /* 
         * Ajax link click (mainly for portfolio items but any content can be linked to) 
         */
    
         $('.ajax').click(function(e){
             e.preventDefault();
             var page = $(this).attr('href');
             $('.container-footer').fadeOut(199);
             $('.last-scroll').val($(document).scrollTop());    //current scroll posn to return to later
             $('html').append('<img src="img/loading.gif" class="load-gif" style="z-index: 999"/>');
             $('.load-gif').css({
                    position:'absolute',
                    left: ($(window).width() - $('.load-gif').outerWidth())/2,
                    top: ($(window).height() - $('.load-gif').outerHeight())/2
                });
             $('#container-isotope').fadeOut(200, function(){
             $.get(page, function(data) {
                  $('.load-gif').remove();
                  $('.ajax-content').html(data);
                  $('#container-isotope').stop().hide();
                  $('.container-footer').fadeIn(599);
                  $('#container-ajax').fadeIn(600, function(){
                      $('.close-ajax').show();
                  });
                  window.scrollTo(0,0);
                }); 
             });
         });
    
         $('.close-ajax').click(function(e){
            e.preventDefault(); 
            $(this).hide();
            $('.container-footer').fadeOut(199);
            $('#container-ajax').fadeOut(200,function(){
                $('#container-isotope').fadeIn(600);
                $('.container-footer').fadeIn(599);
                window.scrollTo(0,$('.last-scroll').val());
                $container.isotope();
                $('#container-ajax .ajax-content').html("");
            });
         });
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?