Web Design Forum: how to rotate objects around in an oval help please - Web Design Forum

Jump to content

WDF
WDF Premium Memberships Reseller Hosting
Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

how to rotate objects around in an oval help please

#1 User is offline   enzodesign 

  • Forum Newcomer
  • Pip
  • Group: Members
  • Posts: 1
  • Joined: 08-January 10
  • Reputation: 0

Posted 08 January 2010 - 09:22 PM

hi all
in advance thanks for looking at my help needed post

i am trying to make my own websites,
in the past ive bought premade flash and dynamic flash sites and then modified them with cs3 so ive a little but not much knowledge

what i now want to do is make a simple fast loading front page with 8 pictures in it rotating in an oval shape around the centre, then when you click on the image it brings up the text in the centre that tells you what is in this sub site, by clicking on it it redirects you to that flash site (basically i have 6 products and want to run a specific flash site for each one

for example of my flash site
www.enzodesign.co.uk/minisprint
www.enzodesign.co.uk/edf430

i got some free code a while back to make objects go around in a circle
here it is below but i really need an oval (so it doesnt overlap the centre text)
ive left the authours details in it as it is shareware and i hope its helpful to others too

if anyone could tell me how to adapt this to make it an oval not a circle i would be enternally thankfull, well at least until my next question!"!!


many thanks

james

<style>
<!--
.circle { font-family: Verdana, Helvetica; font-size: 12px; color: #000000; position:
absolute; visibility: hidden; z-index: 2 }
.text { text-align: left; font-family: Verdana, Helvetica; font-size: 12px; color:
#000000; position: absolute; top: 375px; left: 255px; width:
225px; visibility: hidden; z-index: 0 }
.picture { font-family: Verdana, Helvetica; font-size: 12px; color: #000000; position:
absolute; top: 10px; left: 10px; visibility: visible; z-index: 1 }
-->
</style>

into body section

<script LANGUAGE = "JavaScript">
// Courtesy of SimplytheBest.net - http://simplythebest.net/scripts/
function showObject(object) {
object.visibility = VISIBLE;
}
function hideObject(object) {
object.visibility = HIDDEN;
}
function slidepicture(from, to) {
if (from < to) {
website.top = (from += 10);
setTimeout('slidepicture(' + from + ',' + to + ')', 75);
}
else initObjects();
}
function rotateObjects() {
for (var i = 0; i < pos.length; i++) {
pos[i] += inc; objects[i].visibility = 'visible';
objects[i].left = (r * Math.cos(pos[i])) + xoff
objects[i].top = (r * Math.sin(pos[i])) + yoff;
}
rotateTimer = setTimeout("rotateObjects()", 75);
}
function initObjects() {
objects = new Array(circle1, circle2, circle3, circle4, circle5, circle6);
pos = new Array();
pos[0] = 0;
for (var i = 1; i < objects.length; i++) {
pos[i] = parseFloat(pos[i - 1] + ((2 * pi) / objects.length));
}
rotateObjects();
}
// Variables for rotating images/text //
var objects;
var pos;
var r = 150; // radius
var xoff = 320; // horizontal position
var yoff = 350; // vertical position
var pi = Math.PI;
var inc = pi / 180; // the higher the number the slower the speed of rotation
var objects;
var pos;
</SCRIPT>


AND INTO BODY SECTION NOT TAG


<div id="circle1" class="circle">
<a href="http://simplythebest.net/software/" onmouseover="showObject(text1)" onmouseout="hideObject(text1)"><img src="http://simplythebest.net/scripts/DHTML_scripts/icons/smallheadshare.gif" border="0" width="111" height="29"></a><br>
</div>
<div id="circle2" class="circle">
<a href="http://simplythebest.net/scripts/" onmouseover="showObject(text2)" onmouseout="hideObject(text2)"><img src="http://simplythebest.net/scripts/DHTML_scripts/icons/smallheadscripts.gif" border="0" width="111" height="29"></a><br>
</div>
<div id="circle3" class="circle">
<a href="http://simplythebest.net/fonts/" onmouseover="showObject(text3)" onmouseout="hideObject(text3)"><img src="http://simplythebest.net/scripts/DHTML_scripts/icons/smallheadfonts.gif" border="0" width="111" height="29"></a><br>
</div>
<div id="circle4" class="circle">
<a href="http://web.simplythebest.net/" onmouseover="showObject(text4)" onmouseout="hideObject(text4)"><img src="http://simplythebest.net/scripts/DHTML_scripts/icons/smallheadsrch.gif" border="0" width="111" height="29"></a><br>
</div>
<div id="circle5" class="circle">
<a href="http://simplythebest.net/music/" onmouseover="showObject(text5)" onmouseout="hideObject(text5)"><img src="http://simplythebest.net/scripts/DHTML_scripts/icons/smallheadmusic.gif" border="0" width="111" height="29"></a><br>
</div>
<div id="circle6" class="circle">
<a href="http://games.simplythebest.net" onmouseover="showObject(text6)" onmouseout="hideObject(text6)"><img src="http://simplythebest.net/images/icons/smallheadinfo.gif" border="0" width="111" height="29"></a><br>
</div>
<div id="website" class="picture">

</div>
<div id="text1" class="text">
<p align="center"><b>Simply the Best<br>
Shareware & Freeware</b><br>
Business<br>
Graphics<br>
Programming<br>
Utilities<br>
Web utilities<br>
Home and Hobby</p>
</div>
<div id="text2" class="text">
<p align="center"><b>Simply the Best<br>
Scripts</b><br>
DHTML Scripts<br>
JavaScripts<br>
VBScripts<br>
CGI Scripts</p>
</div>
<div id="text3" class="text">
<p align="center"><b>Simply the Best<br>
Free Fonts</b><br>
Fonts of the month<br>
Fonts guide<br>
Submit font<br>
Font search</p>
</div>
<div id="text4" class="text">
<p align="center"><b>Simply the Best<br>
Web Search</b><br>
Top keywords<br>
Add URL<br></p>
</div>
<div id="text5" class="text">
<p align="center"><b>Simply the Best<br>
Music</b><br>
Music artists<br>
Music industry<br>
Submit listing<br>
Music guide</p>
</div>
<div id="text6" class="text">
<p align="center"><b>SimplytheBest Info Library</b><br>
Blogs<br>
Free Fonts<br>
Friends<br>
Free Online Games<br>
Music<br>
Scripts<br>
Software<br>
Free Sounds<br>
and more..</p>
</div>
<script LANGUAGE = "JavaScript">
var isNS = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) >= 4);

var HIDDEN = (isNS) ? 'hide' : 'hidden';
var VISIBLE = (isNS) ? 'show' : 'visible';
var circle1 = (isNS) ? document.circle1 : document.all.circle1.style;
var circle2 = (isNS) ? document.circle2 : document.all.circle2.style;
var circle3 = (isNS) ? document.circle3 : document.all.circle3.style;
var circle4 = (isNS) ? document.circle4 : document.all.circle4.style;
var circle5 = (isNS) ? document.circle5 : document.all.circle5.style;
var circle6 = (isNS) ? document.circle6 : document.all.circle6.style;
var website = (isNS) ? document.website : document.all.website.style;
var text1 = (isNS) ? document.text1 : document.all.text1.style;
var text2 = (isNS) ? document.text2 : document.all.text2.style;
var text3 = (isNS) ? document.text3 : document.all.text3.style;
var text4 = (isNS) ? document.text4 : document.all.text4.style;
var text5 = (isNS) ? document.text5 : document.all.text5.style;
var text6 = (isNS) ? document.text6 : document.all.text6.style;

slidepicture(0, 0);
</SCRIPT>
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users