Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 487
  • Last Modified:

JQuery slider width

Hi guys,

I am trying to use the following slider : basic-slider.com

My website is test.urban-indoors.co.uk

Im trying to get the slider to be 990px wide, as you can see on the left there is always a small gap and you can see a small part of the previous image, any ideas? I should mention that both the BeModern images are 990px wide

Many Thanks,
Dean.
0
deanlee17
Asked:
deanlee17
  • 5
  • 4
1 Solution
 
mkgtvmCommented:
It seems that the left value you are assigning for the picture (I believe you are doing it through javascript as I cant see it that in the CSS file) is 10px less than where it has to be the correct left value. Please correct the logic in calculating the left value and see.
0
 
deanlee17Author Commented:
Ok im kind of with you here. But im not sure exactly what the that value is called or set to in the javascript file. I'm confident its not a css issue
0
 
deanlee17Author Commented:
The only size change I made was in the attached bit of code, as you can see, ive changed the size quite a lot from the original (width:620) so I cannot see why its 10px short, ive tried setting it to 1000px wide, same issue.

jQuery(document).ready(function($) {
    $('#banner-fade').bjqs({
        'height' : 320,
        'width' : 620,      <-- changed to 990
        'responsive' : true
    });
});

Open in new window

0
Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

 
mkgtvmCommented:
<ul class="bjqs" style="height: 235px; width: 6930px; left: -2970px; display: block;"><li class="bjqs-slide" style="height: 235px; width: 990px; display: list-item; float: left; position: relative;" data-clone="first" data-slide="0">

See the value of left as 2970, it changes when you have the pictures moving in the div banner-slide. I assume some value is set there by some function which I can't seen in my debug window. If you set that value correctly by adjusting the px value, it will render correctly. Hope this will resolve the problem
0
 
deanlee17Author Commented:
Yes just working on that.

-2970 is 3 * 990 (obv with a minus added)
0
 
deanlee17Author Commented:
Oddly tho in the demo the width is 620 and images are 620, yet mine is 990 and images are 990 and suddenly there is a gap, odd.
0
 
mkgtvmCommented:
Ok. Let me know if you need more help. Thanks
0
 
deanlee17Author Commented:
Should be ok, I can get it working on my desktop, just need to get it into the management system that my hosting company use.

Thanks for your help
0
 
mkgtvmCommented:
Great, and if you are happy with my help accept my solution.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 5
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now