You are viewing our Forum Archives. To view or take place in current topics click here.
Anybody used Orbit content slider before from codecanyon?
Posted:

Anybody used Orbit content slider before from codecanyon?Posted:

TeamJTAG
  • Prospect
Status: Offline
Joined: Jul 09, 201014Year Member
Posts: 602
Reputation Power: 23
Status: Offline
Joined: Jul 09, 201014Year Member
Posts: 602
Reputation Power: 23
Hey

I have a problem with Orbit content slider, I want it to fit across the users screen and then the content to be centered with the rest of the layout...

Like this: (The writing aligned with logo and arrows/area fits across screen)
[ Register or Signin to view external links. ]

But it looks like this: (The width is currently in px but I want it as a % so it changes depending on the users screen resolution)
[ Register or Signin to view external links. ]

The CSS for the content slider:

/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
================================================== */
#featured {

height: 268px;
background: #000 url('../orbit/loading.gif') no-repeat center center;
overflow: hidden; }
#featured>img,
#featured>div,
#featured>a { display: none; }




/* CONTAINER
================================================== */

div.content {
background: url(../images/featuredbg.png) repeat-x;
font-family: "Trebuchet MS", "Ariel";
font-size: 15px;
color: #e13535;
width: 1423px;
height:268px;
padding-left: 110px;
padding-top: 85px;
}

div.orbit-wrapper {
width: 1px;
height: 1px;
position: relative; }

div.orbit {
width: 1px;
height: 1px;
position: relative;
overflow: hidden }

div.orbit>img {
position: absolute;
top: 0;
left: 0;
display: none; }

div.orbit>a {
border: none;
position: absolute;
top: 0;
left: 0;
line-height: 0;
display: none; }

.orbit>div {
position: absolute;
top: 0;
left: 0;
height: 268px;
margin:0px auto 0 auto; }


Been stuck on this for a while so will greatly appreciate all help, thanks.
#2. Posted:
Imp
  • Blind Luck
Status: Offline
Joined: Jan 01, 201113Year Member
Posts: 1,957
Reputation Power: 401
Status: Offline
Joined: Jan 01, 201113Year Member
Posts: 1,957
Reputation Power: 401
Have you tried removing the width CSS style completely?

If the doesnt work. Remove it then add the fuild option to the orbit initial code.


   $(window).load(function() {
       $('#featuredContent').orbit({ fluid: '16x6' });
   });


Not sure if that will do it, but investigating the orbit content slider, it appears to be the solution. Here is where i found the source. [ Register or Signin to view external links. ]
#3. Posted:
TeamJTAG
  • Prospect
Status: Offline
Joined: Jul 09, 201014Year Member
Posts: 602
Reputation Power: 23
Status: Offline
Joined: Jul 09, 201014Year Member
Posts: 602
Reputation Power: 23
Imp wrote Have you tried removing the width CSS style completely?

If the doesnt work. Remove it then add the fuild option to the orbit initial code.


   $(window).load(function() {
       $('#featuredContent').orbit({ fluid: '16x6' });
   });


Not sure if that will do it, but investigating the orbit content slider, it appears to be the solution. Here is where i found the source. [ Register or Signin to view external links. ]

Thanks very much, I will look into this now, +rep
Jump to:
You are viewing our Forum Archives. To view or take place in current topics click here.