Forum Replies Created

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • in reply to: How to display one image at the time with the owl slider? #17972

    jascal
    Participant

    Somehow when i want owl carousel to show a single item it doesnt work. I add the following code in javascript, html and css. Is there maybe a conflict?? It still shows three images in my carousel. This should work according to the official owl-carousel page. Here is my link: http://jasencal.nl/owl-test/

       $(document).ready(function() {
         
          $("#owl-demo").owlCarousel({
         
              navigation : true, // Show next and prev buttons
              slideSpeed : 300,
              paginationSpeed : 400,
              singleItem:true
         
              // "singleItem:true" is a shortcut for:
              // items : 1, 
              // itemsDesktop : false,
              // itemsDesktopSmall : false,
              // itemsTablet: false,
              // itemsMobile : false
         
          });
         
        });
    

    For html:

    
        <div id="owl-demo" class="owl-carousel owl-theme">
         
          <div class="item"><img src="assets/fullimage1.jpg" alt="The Last of us"></div>
          <div class="item"><img src="assets/fullimage2.jpg" alt="GTA V"></div>
          <div class="item"><img src="assets/fullimage3.jpg" alt="Mirror Edge"></div>
         
        </div>
    

    for CSS:

    
        #owl-demo .item img{
            display: block;
            width: 100%;
            height: auto;
        }
    • This reply was modified 2 months, 1 week ago by  jascal.
    • This reply was modified 2 months, 1 week ago by  jascal.
    in reply to: Hide logo on scroll #17957

    jascal
    Participant

    Excuse me the right code is:

    jQuery(function($){    
        $(window).scroll(function(){ 
            if($(window).scrollTop() > 0) {
                $('.navi-logo').hide();  // Hide your element
            } else {
                $('.navi-logo').show(); // It's just if you want to show back the element if we're back on top
            }
        }); 
    });
    
    in reply to: Hide logo on scroll #17941

    jascal
    Participant

    I have the answer and it works 🙂

    I added this in custom.theme.js

    jQuery(function($){
    $(window).scroll(function(){
    if($(window).scrollTop() > 0) {
    $(‘.navi-logo’).hide(); // Hide your element
    } else {
    $(‘.navi-logo’).show(); // It’s just if you want to show back the element if we’re back on top
    }
    });
    });

    • This reply was modified 2 months, 2 weeks ago by  jascal.
    • This reply was modified 2 months, 2 weeks ago by  jascal.
    in reply to: Bottom Navigation Menu #17815

    jascal
    Participant

    Yes, I did this but still get the animation effect.

    Thanks!

    in reply to: How to display one image at the time with the owl slider? #17814

    jascal
    Participant
    This reply has been marked as private.
    in reply to: How to display one image at the time with the owl slider? #17810

    jascal
    Participant

    I mean for the slider template of a single portfolio.

    in reply to: Bottom Navigation Menu #17809

    jascal
    Participant
    This reply has been marked as private.
    in reply to: Bottom Navigation Menu #17803

    jascal
    Participant

    Thanks. This Works. The only thing is that it first loads the menu in the header and then moves down the page. Is there a way to let it appear at the bottom straight away?

    in reply to: Bottom Navigation Menu #17787

    jascal
    Participant

    Another question: How can i have the owl carousel (slider) only display one image at a time instead of a few images the complete width of the page? I cant get it to work if i edit the custom.theme.js

    Thank you so much for the support.

    in reply to: Bottom Navigation Menu #17785

    jascal
    Participant

    I just have the normal menu layout ( text links only ). The website is on http://www.jasencal.nl .

    in reply to: Bottom Navigation Menu #17764

    jascal
    Participant

    The logo can stay at top. Only the header menu.

Viewing 11 posts - 1 through 11 (of 11 total)

Join Newsletter(FREE)

Subscribe to our newsletter to receive news & updates. We promise to not spam you, super promise!