Jump to content

positioning slideshows

MediaSvcsUnlimited

By MediaSvcsUnlimited
in Javascript Help

 Share

Recommended Posts

MediaSvcsUnlimited Member

MediaSvcsUnlimited

Posted
Posted

Hi, I'm new to javascript so please bear with me.  I have a text slideshow and I'm having problems having the elements below it move.  I thought if I made the div long enough it wouldn't do it, but that's not helping.  if I could get some help, I would really appreciate it.  Here's the link to the page http://mediaservicesunlimited.com/homeTest.php and here's the code.  

<?php
require_once('functions.php');
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="http://www.linkbuildingservices4sites.com/resources/slide-show.js"></script>
<link rel = "stylesheet" href = "MSU.css">
   <!--[if It IE 9]>
    <script src="http://html5shiv.googlecode-.com/svn/trunk/html5.js">
    </script>
    <![endif]-->
<style type="text/css">
	.flip3D {
		width: 320Px;
		height:200px;
		float:left;
		margin:10px;
	}
	.flip3D > .front {
		position:absolute;
		transform:perspective(600px)
		rotateY(0deg);
		background-color: #99cc99;
		width:320px;
		height:200px;
		border-radius:7px;
		backface-visibility:hidden;
		transition:transform .5s linear 0s;
	}
.flip3D > .back {
		position:absolute;
		transform: perspective(600px)
		rotateY(180deg);
		background-color:#99CC99
		width:240px;
		height:300px;
		border-radius: 7px;
		backface-visibility: hidden;
		transition: transform .5s linear 0s; 
}
.flip3D:hover > .front {
	transform: perspective(600px) rotateY(-180deg);
}
.flip3D:hover > .back {
	transform: perspective(600px) rotateY(0deg);
}
#testimonies {
	height:80%;
	width:40%;
	margin-right:auto;
	margin-left:auto;
	text-align:center;
	padding-left:10%;
	padding-right:10%;
	padding-bottom:2%;
	padding-top:2%; 
	background-color:#cae7eb;
}
li {
	list-style:none; 
}
#portfolio {
	clear:both;
}
.quotes
        {
			display:none; 
		}
footer {
	clear:  both;
}
          
</style>

<link href="MSU.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.button.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.tabs.min.css" rel="stylesheet" type="text/css">
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->
<script src="jQueryAssets/jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery.ui-1.10.4.button.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery.ui-1.10.4.tabs.min.js" type="text/javascript"></script>
<script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/bad-script:n4:default;arbutus:n4:default;allan:n7:default.js" type="text/javascript"></script>
    <script type="text/javascript">
        (function() {

    var quotes = $(".quotes");
    var quoteIndex = -1;
    
    function showNextQuote() {
        ++quoteIndex;
        quotes.eq(quoteIndex % quotes.length)
            .fadeIn(2000)
            .delay(1500)
            .fadeOut(2000, showNextQuote);
    }
    
    showNextQuote();
    
})();
var slideArray = new Array()
slideArray[0]= "Mindy was a great employee.  She was always on-point, task driven, and greatly assisted in our sales efforts.  Our business is very challenging and competitive, but Mindy helped us to overcome obstacles and succeed whenever possible. <br /> Jon Landua EarthCoolor";
slideArray[1]= "We chose Mindy because of her creativity, professionalism and ability to \"beat the clock\". We were pleased with the finished marketing projects she completed on behalf of our fundraiser!\" Wells Community Boys & Girls Club";
slideArray[2]= "Mindy did an outstanding job working with our sales team. Her hard work and intuitive approach were valuable assets in helping us achieve our sales goals.\” Kim Price EarthColor";

function textSlideShow()
{
var total_slides;
total_slides=Math.floor(Math.random()*slideArray.length)
document.getElementById('testimonies').innerHTML=slideArray[total_slides];
setTimeout("textSlideShow()",800);
}
</script>
  
</head>

<body>   
<?php logoMenu();?>
<article>  
Media Services Unlimited (MSU) was founded by Indiana entrepreneur Mindy Thomas to offer a variety of creative services to small business owners and not-for-profit organizations that cannot afford their own in-house marketing staff.  Here are just some of the services offered by our company:<br />
•	Web design <br />
•	Web content management<br />
•	Search engine optimization (SEO)<br />
•	Social media management<br />
•	Video editing<br />
•	Marketing material creation <br />
•	Creative writing<br /><br />
Let Media Services Unlimited handle your marketing so you can concentrate on the other important aspects of operating and growing your organization!
<!--Running a business, of any size, is rough, but it's especially rough for small  businesses.  as an owner of a small business, you wear so many hats!  You are the salesperson, the producer of the product, and sometime you have to do all the marketing work.  Wouldn't it be nice if there was a way to hand the marketing tasks to someone else, and not have to hire a full-time marketing staff?  Well, fortunately there is!  Media Services Unlimited is a full-service marketing company specifically geared towards small businesses.  We handle all the marketing tasks, so you can focus on producing high-quality products and your customers!  -->
</article>
<div id="testimonies"><script type="text/javascript" language="javascript">textSlideShow();</script></div>
<div id = "portfolio">
<div class ="flip3D">
	<div class ="front">
		Website Portfolio 
    </div> 
	<div class ="back">
		<ul> 
            	<li>Website Design </li>
                <li>Content Management </li>
                <li>SEO</li>
            </ul>
    </div>    
</div>
<div class ="flip3D">
	<div class ="front">
		Marketing Portfolio 
    </div> 
	<div class ="back">
		<ul>
            	<li>Marketing Material Creation  </li>
                <li>Social Media Management </li>
                <li>Creative Writing </li>
                <li>Video Editing </li>
            </ul>
    </div>    
</div>
</div>
<?php footer(); ?>
</body>
</html>
Link to comment
https://forums.phpfreaks.com/topic/300296-positioning-slideshows/
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.