Skip to content
Grav 2.0 is officially stable. Read the announcement →
Archive

Owl-Carousel

Started by Muut Archive 11 years ago · 7 replies · 1050 views
11 years ago

I was wondering if I could get some insight on functionality for the owl-carousel within grav. I am having difficulty getting the slider to show up. I know the new Grav Homepage uses Owl, so I must be missing something. I have a test area set up on a site here: http://hagstrombuilder.com/error Any insights into what I may be missing would be great. Thank You!

11 years ago

Hmm.. inspector states:
https://dl.dropbox.com/s/zueyv3eyi0lxwpa/Custom_Homes__Hagstrom_Builder_Inc._2015-11-10_10-44-21.png
That means your scripts does not recognize objects. I would try moving all scripts (except jquery and modernizer) to the footer of your theme. Also

TXT
$.slidebars({
            hideControlClasses: true,
            scrollLock: true
          });

This calls for slidebars object. I don't see it in your code. Maybe you changed class names ?

11 years ago

@ameo, yes this would be a great plugin, might be something to work on in the future.
I have resolved the script error I was receiving before regarding the owlCarousel, however, now the css is telling the carousel to display:none; I am not sure why this is happening, I must be missing a step somewhere, I took a look at the carousels on the grav homepage and have attempted to replicate some of those setting to no success. Any insights?? Thanks. Screen Shot 2015-11-11 at 12

11 years ago

This script:

JS
    <script>
    $(document).ready(function(){
      $(".carousel-1").owlCarousel({
          items: 1,
          nav: true,
          loop: true,
          lazyLoad: true,
});
})
</script>

Must be at the same bottom of your website. It can't be at the top because carousel markup is loaded after that and script is not initialized.

11 years ago

actually hold on.. I think it's not a problem with script location... Problem might be caused by other scripts which are still causing errors.

11 years ago

Thanks, I have gotten the carousels working without any issue now. I do have a question about the pinterest pinit button, I have an example here: http://hagstrombuilder.com/newportfolio The top two carousels have dummy images in them for the time being, but I cant get the PinIt button to show up on hover the way it does on the bottom image which is just a regular <img> tag. Can anyone assist with this?

11 years ago

@erikhanshagstrom could you maybe write some kind of tutorial on how you did it. you know - for the rest of us :p

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 1349 9 years ago
Archive · by Muut Archive, 9 years ago
2 934 9 years ago
Archive · by Muut Archive, 9 years ago
2 4060 9 years ago
Archive · by Muut Archive, 9 years ago
1 2946 9 years ago
Archive · by Muut Archive, 9 years ago
3 1118 9 years ago