PDA

View Full Version : Placing a 3D Image Flip into a Functioning SlideShow??



stan602
07-22-2013, 02:41 PM
1) Script Title: CSS 3D Flip and Featured Content Slider v2.5

2) Script URL (on DD): http://www.dynamicdrive.com/style/csslibrary/item/css_3d_flip/ and http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

3) Describe problem:

Hi folks

I'm trying to combine 2 codes from here 1 is the CSS 3D Flip and the other is Conentslider CSS and I'm failing miserably lol. I'd very much like to combine these 2 pieces of code so they work together or if one of you would be so kind to create me a code that would serve both the functional aspects of these 2 brilliant pieces of code into one.

Thanks in advance guys

Beverleyh
07-22-2013, 02:51 PM
Warning: Please include a link to the DD script in question in your post. See this thread (http://www.dynamicdrive.com/forums/showthread.php?t=6) for the proper posting format when asking a question.

Please post a link to the page on your site that contains the problematic script so we can check it out.

stan602
07-23-2013, 11:24 AM
CSS 3D Flip
http://www.dynamicdrive.com/style/csslibrary/item/css_3d_flip/
Featured Content Slider v2.5
http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

Sorry I beg your pardon Im very new to this. What im looking to do is combine these 2 scripts so that when the photo is clicked the photo will flip to the designated back picture. Can this been done or am I being stupid? lol
Kindest Regards
Conor

Beverleyh
07-23-2013, 11:35 AM
Yes, that should be doable - the content slider is JavaScript-based but the actual content that each slide holds can be text or images. I imagine that you would put your 3D flip images inside the slides (in the place advised below) and apply the advised CSS3 to them from the 3D flip page.

<div class="contentdiv">
<div class="flip" style="display: inline-block; margin-right: 40px">
<div class="rotate x">
<img src="media/desert.jpg">
<div>
A desert is a landscape or region that receives an extremely low amount of precipitation, less than enough to support growth of most plants. <br /><br />
<img src="media/desertstrip.jpg" style="margin:0 auto" />
</div>
</div>
</div>
</div>

Please post your web page though so we can see where you are going wrong and what you have so far.

stan602
07-23-2013, 11:57 AM
Thank you so much. I cant put the link to the website up because its not finished yet! But if you would be so kind to give me your email address I will gladly send you all my html for some pointers.

Thanks agian
Conor

Beverleyh
07-23-2013, 12:05 PM
If you paste your markup into a post, that would easier.

You see, I'm going on lunch now and then finishing for the day soon afterwards (summer break begins and I'm off to the staff knees-up!), so if you post what you have in the forum, somebody else will be able to offer help while I'm not around.

That would in turn help others who have the same problem, so its a double-whammy of helpfulness :)

stan602
07-23-2013, 12:09 PM
No problem I will once I apply these changes. Thank you so much and enjoy your time off.