Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Missing some content on last part of the div. #186

Open
naughty-dog opened this issue Jan 16, 2015 · 0 comments
Open

Missing some content on last part of the div. #186

naughty-dog opened this issue Jan 16, 2015 · 0 comments

Comments

@naughty-dog
Copy link

Sorry before for my bad English,
I had a little problem here that i cannot solved by my self, honestly I already stacked on this for almost a week.
Here's my HTML code

<div class="thumbImgContainer">
    <a href="javascript:somelinkusingscript"><img src="./img/#1" /></a>
    <a href="javascript:somelinkusingscript"><img src="./img/#2" /></a>
    <a href="javascript:somelinkusingscript"><img src="./img/#3" /></a>
    <a href="javascript:somelinkusingscript"><img src="./img/#4" /></a>
    <a href="javascript:somelinkusingscript"><img src="./img/#5" /></a>
    <a href="javascript:somelinkusingscript"><img src="./img/#6" /></a>
       ...
</div>

And here's my js (no options actually)

$(".thumbImgContainer").smoothDivScroll();

This is my CSS

.overlayGallery .thumbImgContainer {
    position: absolute;
    width: 100%;
    height: 80px;

    overflow: hidden;

    bottom: 0;
    left: 0;

    text-align: center;

    background-color: #000;
    background-color: rgba(0,0,0,.8);

    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.overlayGallery .thumbImgContainer a img {
    height: 74px;
    width: 131px;
    opacity: .4;
    margin: 3px 2px;

    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.overlayGallery .thumbImgContainer a:hover img,
.overlayGallery .thumbImgContainer a#current img {
    opacity: 1;
}

Otherwise, I'm using jQuery SmoothDivScroll 1.3 CSS and JS (no modification) and also jQuery 1.10.2 as well.

My problem was, as you see on html code, there would be so many images i included there (using php query from db - don't know if this has relevance to the problem).
But the 'last' content ( for example, img#6 ) won't showed, it's just showed until img#5.
When I inspect element, it's showed, but somehow it's alone placed on the bottom of the other, yet my div overflow hidden.
Hope you could understand what I mean, and could fix my problem.
Thanks so much ..

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant