Coder Social home page Coder Social logo

basic-jquery-slider's People

Contributors

jcobb avatar weerdenburg avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

basic-jquery-slider's Issues

container

I have a newbie question: I'm trying to place the slider into a specific area on a page but the "container" is wrapping the entire page rather than wrapping just the slider. Everything else is working fine but I can't figure out how to "move" the container to where I need it. Looks like the object is being generated by the script and i'm not sure how to change it or if that's the correct approach at all

Dynamic Next/Previous

Great plugin; very lightweight and flexible.

Would it be possible to add an option to hide the "previous" button if you're on the first slide and to hide the "next" button on the last one when the "showControls" option is set to true? Also, it would be nice to be able to position the controls independent of the banner containing div.

Cheers,
Matt

Key value is 1 higher then normal?

Line 131 in slidey-plugin.js

$.each(banners,function(key,value){
    key++
        if(settings.animType == 'slide'){

          if(key != 1 && key != banners.length)
             $('<li><a href="#">'+key+'</a></li>').appendTo($marker_wrapper);
       }
       else{
        $('<li><a href="#">'+key+'</a></li>').appendTo($marker_wrapper);
        }
});

The key value that is added to the link is higher then the actually slide being viewed.
eg.
If i want to add the key to be the class of the

  • and i am viewing, slide 1 it has the key of 2.

    No big issue, but just thought I would point it out. :D

    AWESOME WORK and may this be the beginning of DA SLIDER!!

  • Header tags?

    Is there a simple way to allow for header tags? I'd like to add titles in my captions, but since it's pulling from the title tag, it's not currently possible.

    2 sliders at the same time?

    Is it possible to run 2 sliders in the same document? I've got 2 div's with different sizes, (#slideshow-1, #slideshow-2), and have got the script for both of them, but it seems to mix them up. Is it possible to run 2 at the same time?

    EDIT: The hacky solution I've done now, is to make a copy of both the script and the css, and replace "bjqs" with "bjqs2". It works, but it's not great as it needs to load those files twice.

    video tag in li

    If there is an html5 video tag sitting in one of the li tags, and you click either the prev or next button, any suggestions on how to pause the video?

    Up to down...

    Hello
    Is this possible to tell to the slide going up to down direction instead of left to right ?
    Thank's

    Expose bjqsGo to the outside world

    Hi,

    First of all, great plugin. Very nice implementation.

    It would be nice if you could expose the bjqsGo function to the outside world, so pages can be changed programmatically from outside the plugin.
    I know that I can do this myself (and I did), but I thought that maybe it would be a nice feature request since IMHO it will make the plugin usable for many more people.

    Thanks,
    Ofir

    Making links/thumbnails change slider pages?

    Is there a way to make the slider pages change when clicking on a text link or thumbnail image (preferably both)? Similar to the way in which the different markers bring up the different pages currently.

    Nav Drop Down appears behind Slideshow

    Is there a way to get my navigation menu drop down to appear above the slideshow? Right now it is behind. I tried using z-index in the CSS code.

    Thank you!

    Duration of Transition

    I tried to change the
    animationDuration: 450,

    to

    animationDuration: 2000,

    but there is no effect for the fade-Effect

    how can i expand the fade-Effect?

    Slide jumps to the right before slide animation in Chrome

    I downloaded your demo page and have tried to use the js in my projects (everything works great) but there is a "jitter" in Chrome in the slide animation. This happens in your demo and in my implementations of your plugin. Just before the slide begins to slide left it jumps right about 20-40px or so. This does not occur in Firefox for some reason. Any thoughts? Have you noticed this?

    Width in %

    Right now it's not possible to pass a % as a value for "width". Would be great to include this, for responsive designs. A problem with it is that there's no way to ensure consistency, any ideas how to fix this?

    html inside slider

    Hi, I want to add an html page inside the slider instead of an image. whats the code to put inside the

  • ?

    Slider start when only one image and hoverPause is true

    Hi John,

    I think I may have found a small bug. I am dealing with a slider that will start with one image, but has the potential to have many more. When starting with the one image, I have the initialization code set as such:

    $('#hdft-header').bjqs({
    animation: 'slide',
    showControls: false,
    showMarkers: false,
    useCaptions: false,
    width: 940,
    height: 400
    });

    It displays as it should. However, if you mouse-over the image, the pause countdown starts and the slider will move. I found a workaround by adding hoverPause: false to the initialization string. Unfortunately, I didn't want to leave it this way once the site is released to the client. After looking over the code, I found if you change Line 213 from "if (settings.hoverPause && settings.automatic) {" to "if (settings.hoverPause && settings.automatic && slideCount > 1) {" it corrected the issue.

    Cheers,
    Matt

    Cms Made Simple TypeError:

    Hi, i have try this in local and works 100%
    But now i have add it to cmsms and i have this error`?
    TypeError: 'undefined' is not a function (evaluating '$('#banner').slidey')
    do you know what is the issue?

    Tabbing through links inside the slider

    If you have elements inside some of the slides which can receive focus, and a user is using the tab key to navigate through links of a page, when they come to any links inside the slider, the positioning / order of the slides gets messed up.

    See here:
    http://jsfiddle.net/B9nVy/9/

    If you set focus in the result area and use the tab key to navigate through, you'll see that in the slider the browser jumps form link to link, but the position of the slide is incorrect.

    What I'd like to see is, when you set focus on an element inside a slide that is not currently visible, that slide is automatically transitioned to.

    useCaptions: bad selector if images are nested

    The current selector won't find an imagecaption of nested images because of the used .children()-method.

    Line 202 should be changed from:
    var $slideChild = $slide.children('img:first-child');
    to
    var $slideChild = $slide.find('img').first();

    Absolute position of an alement?

    He! Love the script, guys. Thank you so much.

    Question: How do I float an element that sits within the slider

  • above the slider
  • ?

    For example, here is my code:

        <!-- start Jquery Slider -->
        <ul class="bjqs">
    
          <li class="slide1"><img src="image1.png" width="476" height="457" alt="Image 1"></li>
    
          <li class="slide2"><img src="image1.png" width="476" height="457" alt="Image 2"></li>
    
        </ul>
        <!-- end jQuery Slider -->
    

    I want the image in each slide to float above and slightly outside of each slide at this style:

    .bjqs li img {
    position: absolute;
    z-index: 5;
    right: -30px;
    bottom: -30px;
    width: 476px;
    height: 457px;
    }

    Unfortunately, however, by setting a width and height in the javascript for this slider, the image gets cut off. Any way around that? Thanks!

  • Multiple sliders on a page

    Hi there,

    I'm trying to put several sliders on a page. Text div on the left and image slider on the right. I changed the name of the second slider to banner2, but my divs are still looking misaligned, as are the markers, so I feel like I'm missing some kind of a differentiation, other than the name of the banner. Any suggestions?

    Not showing full image

    Hey.
    First of all great plugin. The only problem I having is that every time it slides, there is a right margin error.
    For example: for slide two you can see 1 px of slide one and on slide three you can see 2 pixel of slide 2 and it goes on.
    For better understanding check out live demo at www.queenofcondo.ca

    Maybe I did something wrong. My

  • code is something like like this:

  • Please Guide.
    Thanks

    Markers refusing to NOT show

    John, thanks for this great slider - just what I wanted to put some fade in / out text on a website.

    I have set showMarkers to 'false' - but they won't go away! I can hide them using CSS, but wonder if it's something I'm doing or if there is a genuine "issue".

    Thanks in advance for your time and efforts on this project.

    (grateful) Juliet

    Child Lists

    List content within each ul.slide li ends up with display:none attribute applied to them. Slidey needs some other sort of way selecting the list and list items or the css needs adjusted to only select the first ul/li and not any child lists.

    slider don't work without css

    ul.bjqs needs position relative, without this css settings, the slider don't work. It would be great to include this in plugin.

    Get dimensions from CSS

    With the eye on responsive webdesign (pages rearranging based on screen size using media queries) it would be great if the height and width could be set in a CSS file.

    Run the script through JsLint.

    Great idea and starting point for your script. But with a quick browse I found multiple basic errors. Please run your file through something like JsLint in order to resolve these.

    Thanks.

    appended div not closed

    in the js when adding

    the div isn't closed which creates an extra div - easy fix but thought I would make you aware. also I am not seeing any of the images for the markers in the downloaded code - am I missing something?

    Currently broken with jQuery 1.7

    Have not had time to test what's breaking right now! but using jQuery 1.7 with the latest 1.1 of basic-jquery-slider and the content vanishes as well as the controls.

    Will update as soon as I have time to test.

    Multiple instance content mixup

    Line 53 should be changed to $slider = $container.find('.bjqs'), to avoid problems when calling the plugin asynchronously.

    Otherwise, great plugin! Thanks.

    No check for markers when animating

    Error thrown when animation function looks for markers and they have not been created, need to wrap in an if statement to check for settings.showMarkers

    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.