Eric's Jquery Cycle - Page 1

User 219465 Photo


Registered User
324 posts

Eric, I am trying to edit your JQuery Cycle, http://progrower.coffeecup.com/jquerycycle.html. I have changed the area size from Width=525 X Height=350 to 450 Wide X 433 Height. What happens is that the radius(rounded) corners are cut off and I am only left with one at the top left. Is there a way to have either all radius corners or none when re-sizing this?

Thanks,
Marc
User 187934 Photo


Senior Advisor
20,245 posts

Link?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 38401 Photo


Senior Advisor
10,951 posts

Have you adjusted both parts?
.pics { height: 382px; width: 557px; padding:0; margin:0; overflow: hidden }
.pics img { height: 350px; width: 525px; padding: 15px; border: 1px solid #ccc; background-color: #eee; top:0; left:0 }

You'll most likely need to make sure both of those are edited in order for the images to show up with the rounded corners correctly. You may need to adjust that .pics setting as that would be like the frame area around the images so you may need to play with those 2 numbers to get it to show the corners correctly.

Let us know if you've already adjusted both of them or if it works when you do. :)
User 219465 Photo


Registered User
324 posts

I did not publish it yet. I will work on it later. I just noticed that I changed it in the two places where I saw the size call outs for size and when I went to the preview in VSD it cut off three of the rounded corners. I will publish later this morning.
User 219465 Photo


Registered User
324 posts

Now, i know there are no images loaded, yet, but the back drop is what am looking at.

http://test.dtscarpentry.com/
User 187934 Photo


Senior Advisor
20,245 posts

I don't see any radius on any of the corners.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 12358 Photo


Registered User
55 posts

Hi Marc,

Looks like your trying to set the carousel, and/or images in the carousel, larger than the actual space you have it in.
The main 'div' width holding the carousel is 420px (uses class "Object118"). This is the div that holds the 'slider' div.
You may want to resize the images and make a few styling adjustments for it to fit.
User 2147626 Photo


Ambassador
2,958 posts

Okay, I'm no coder, but I did try this. This is your code:
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<style type="text/css">
.pics { height: 433px; width: 450px; padding:0; margin:0; overflow: hidden }
.pics img { height: 433px; width: 450px; padding: 15px; border: 1px solid #ccc; background-color: #eee; top:0; left:0 }
.pics img {
-moz-border-radius: 5px; -webkit-border-radius: 10px;


I increased the width to 500px and the entire frame shows. Give you any ideas?
Graphics for the web, email, blogs and more!
-------------------------------------
https://sadduck.com
User 2147626 Photo


Ambassador
2,958 posts

Whoops, looks like I was typing to slow again! :D:D
Graphics for the web, email, blogs and more!
-------------------------------------
https://sadduck.com
User 219465 Photo


Registered User
324 posts

Ok, later I will add the pics and see what happens. I can not have the width any larger than 450. I see a rounded corner at the top left, but maybe once I get the pics in there and working then we can work on any remaining issues.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.