Code Monkey home page Code Monkey logo

Comments (7)

psenger avatar psenger commented on July 21, 2024

Hi Nino,
Its hard to diagnose the problem with what you posted. Can you provide some examples? Maybe a link to your website or create an example on JS Fiddle.
Phil

from swipebox.

nderambure avatar nderambure commented on July 21, 2024

Hi @nino-zeke, there is a destroy function here https://github.com/brutaldesign/swipebox/blob/master/source/jquery.swipebox.js#L426

It's what you need :)

from swipebox.

nino-zeke avatar nino-zeke commented on July 21, 2024

hmm i thought that destroy could help, but apperantly i'm to stupied to use it.

this is my javascript code:

<script type="text/javascript"> $(document).ready(function() { $('#gallery-content').isotope({ // options itemSelector : '.photo', masonry: { columnWidth: 56 } }); // filter items when filter link is clicked $('#categorydropdown a').click(function(){ var selector = $(this).attr('data-filter'); $('#gallery-content').isotope({ filter: selector }, function( $changedItems, instance){ instance.$allAtoms.filter('.isotope-hidden').removeClass('swipebox'); instance.$filteredAtoms.addClass('swipebox'); swipebox().destroy(); $(".swipebox").swipebox(); }); return false; }); $(".swipebox").swipebox(); //$.swipebox([{href:'big/image.jpg', title:'My Caption'},...]); }); </script>

and here is the link to the website:
http://ernesto.psychos.org/gallery
usr:test
pw:test

it's allmost done, just a few small details that we still need to fix for our wordpress update.
please don't comment quite yet in there :)

from swipebox.

nino-zeke avatar nino-zeke commented on July 21, 2024

okay that didn't quite work (more of a photographer then js guy, sorry)
http://snipt.org/AwG4

from swipebox.

brutaldesign avatar brutaldesign commented on July 21, 2024

Hi,

Indeed, using swipebox and Isotope combined would be great.
I am currently working on a solution

Cheers

from swipebox.

brutaldesign avatar brutaldesign commented on July 21, 2024

Hi,

Thx to Alessandro Carbone, the swipebox has now a "refresh" method.
You can refresh the plugin after the isotope filter animation is completed.
like this:

var swipeboxInstance = $(".swipebox:not(.isotope-hidden .swipebox)").swipebox();
    var $container = $( '#grid' );
    var optionFilter = $('#filter'),
    optionFilterLinks = optionFilter.find('a');
    optionFilterLinks.attr('href', '#');
    onAnimationFinished = function(){
        swipeboxInstance.refresh();
    };
    optionFilterLinks.click( function(){
        var selector = $(this).attr('data-filter');
        $container.isotope({ 
            filter : '.' + selector, 
            itemSelector : '.item',
            layoutMode : 'fitRows',
            animationEngine : 'best-available',
        }, onAnimationFinished);
        // Highlight the correct filter
        optionFilterLinks.removeClass('active');
        $(this).addClass('active');
    
        return false;
    });

from swipebox.

kevbook avatar kevbook commented on July 21, 2024

What if new DOM elements were added? Something like when using with load more.

from swipebox.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.