Jump to content
chitrag

Help to edit following code

Recommended Posts

I want to use following code in my site. My content area of page is 600px and want position it correctly in my site. I made it but it does not work. http://www.egtours.com/test.php Content Slider Code /* http://www.menucool.com */#sliderFrame {position:relative;width:600px;margin:0;}#slider { width:600px;height:228px;/* Make it the same size as your images */ background:#fff url(loading.gif) no-repeat 50% 50%; position:relative; margin:0; box-shadow: 0px 1px 7px #999999;}#slider img { position:absolute; border:none; display:none;}/* the link style (if an image is wrapped in a link) */#slider a.imgLink { z-index:2; display:none;position:absolute; top:0px;left:0px;border:0;padding:0;margin:0; width:100%;height:100%;}/* Caption styles */div.mc-caption-bg, div.mc-caption-bg2 { position:absolute; width:600px; height:auto; padding:0; left:0px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/ top:270px;/*if the caption needs to be aligned from bottom, specify by bottom instead of bottom. i.e. top:150px;*/ z-index:3; overflow:hidden; font-size: 0;}div.mc-caption-bg { background-color:transparent;}div.mc-caption { font: normal 12px/16px Verdana; color:#333; z-index:4; padding:10px 0; text-align:left;}div.mc-caption a { color:#09F;}div.mc-caption a:hover { color:#06C;}/* ------ built-in navigation bullets wrapper ------*/div.navBulletsWrapper { display:none;}/* --------- Others ------- */#slider{ transform: translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0);}

Share this post


Link to post
Share on other sites

Sorry for taking so long. Specifically, what are you unhappy with?

Share this post


Link to post
Share on other sites

position it with float:right instead of using positioning.

Share this post


Link to post
Share on other sites

Thank you for your help. It works better than before but still not satisfied. Since, example here I am wondering which variable should I need, is it css issues or js issues ? There are two css files with this slide slow.

Share this post


Link to post
Share on other sites

The only difference between yours and example that affect smoothness is the Description part, it changes while gallery's images slidingTry to find out the animation function and put in another function that run when animation ends $('...').animate({[some css attributes]}, [duration], function(){ //animate stop here, then changes Description here})

Share this post


Link to post
Share on other sites

Thanks, but it is in .js file or in .css file to edit ? I am really newbie

The only difference between yours and example that affect smoothness is the Description part, it changes while gallery's images slidingTry to find out the animation function and put in another function that run when animation ends $('...').animate({[some css attributes]}, [duration], function(){ //animate stop here, then changes Description here})

Share this post


Link to post
Share on other sites

Nope!!! I see it again, smooth now, .js in minimized version so can't be edited, your config code for slider is the same as example, your css just to put the elements in the right place, no effect on smoothness. I see no problem now, sorry to confused you :facepalm:

Share this post


Link to post
Share on other sites

so far I have fix the issues. But it looks fine chrome, firefox but in IE8 it does not show up navigation below large image

Edited by chitrag

Share this post


Link to post
Share on other sites

Because the #slider's width always be set with the same size as original width of the big images, so I think u have to design your images with the fix width (see below, 390px) temporarily, in .css div.mc-caption-bg, div.mc-caption-bg2 -> add width: 390px; #slider -> add width: 390px; (also, overflow: hidden) :)

Share this post


Link to post
Share on other sites

just surround element.fireEvent(event.eventType, event); by try catch try { element.fireEvent(event.eventType, event);} catch (error) { // error here maybe fireEvent not allow the second argument. element.fireEvent(event.eventType);}

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×