ASamBrown - Viewing Profile

ASamBrown's Profile User Rating:

Reputation: 0 Apprentice

Group:: Members
Active Posts:: 36 (0.02 per day)
Joined:: 05-February 09
Profile Views:: 539
Last Active:: Aug 20 2012 09:50 AM
Currently:: Offline

Previous Fields

Dream Kudos:: 0

Latest Visitors

No latest visitors to show

ASamBrown has not set their status

Posts I've Made

In Topic: HTML slide show and the css page

Posted 6 Jul 2012

So far I have not corrected the same ID of "oForward" as that is on the two buttons. What I have now is the three pictures in a column. They should be all in one space (on top of one another) and change pictures in the same place. Here is what I have now. BTW: the mystile.css is in the same directory as the welcome.html page.

<HTML xmlns:t = "urn:schemas-microsoft-com:time">
<HEAD>
<link rel="stylesheet" type="text/css" href="mystile1.css" />

	<TITLE>Welcome</TITLE>

  <script>
  function fnGo(direction)
  {
  // divCollection holds the collection of DIVS in the slide show.
  var divCollection = oWrapperDiv.childNodes;
  var ColLength = divCollection.length;
        for(i=0; i<ColLength; i++)
        {
            if (divCollection(i).style.zIndex == 2)
                {
                if (direction == "forward" && i!=2)
                {
                    var next = i + 1;
                
                }
                else if (direction == "back" && i!=0)
                {
                    var next = i - 1;
                }
                else
                    break;
                // Loop below sets all DIVS to low z-index.
                for(j=0; j<ColLength; j++)
                {
                    divCollection(j).style.zIndex = 0;
                } 
                // Last DIV is set to next highest z-index.       
                divCollection(i).style.zIndex = 1;
                // The DIV that is to transition in is set to highest z-index.
                divCollection(next).style.zIndex = 2;                                             
                var transitionFilterCol = divCollection(next).childNodes;
                var nextTransitionFilter = new Object();
                // Create a reference to the next TRANSITIONFILTER.
                nextTransitionFilter = transitionFilterCol(0);
                var nextDiv = new Object();
                // Create a reference to the next DIV.
                nextDiv = divCollection(next);
                // Begin the next transitionFilter.
                nextTransitionFilter.beginElement();
                // Begin the next DIV
                nextDiv.beginElement();
                break;
            }
        }    
  }
  </SCRIPT>  
  <?import namespace = t urn = "urn:schemas-microsoft-com:time" 
    implementation = "#default#time2" />

</HEAD>
<BODY TOPMARGIN=0 LEFTMARGIN=0 BGPROPERTIES="FIXED" LINK="#000000" VLINK="#808080" ALINK="#000000">
<BLOCKQUOTE CLASS="body">
<BODY BACKGROUND="backgrounds/parchment.gif">
<DIV ID="oWrapperDiv">
<DIV ID="oDiv1" CLASS="time" STYLE="z-index:2">
<t:TRANSITIONFILTER ID="oTran1" BEGIN="indefinite" TYPE="ellipseWipe" DUR="1"/>
<img src="images/dirty_pelican.jpg" width="400" height="265" alt="Dirty Pelican" /><br>

The First One

</DIV>

<DIV ID="oDiv2" CLASS="time" BEGIN="indefinite" STYLE="z-index:1">
<t:TRANSITIONFILTER id="oTran2" BEGIN="indefinite" TYPE="fanWipe" DUR="1"/>
<img src="images/fishing01.jpg" width="400" height="265" alt="Fishing" />

The Second One

</DIV>

<DIV ID="oDiv3" CLASS="time" BEGIN="indefinite" STYLE="z-index:0">
<t:TRANSITIONFILTER ID="oTran3" BEGIN="indefinite" TYPE="pushWipe" DUR="2"/>
<img src="images/Powerboat01.jpg" width="400" height="265" alt="Power Boat" />

The Last One

</DIV>
</DIV>

<BUTTON ID="oForward" onclick="fnGo('forward');" STYLE="position:absolute; top:460;left:100;">Forward</BUTTON><br>

<BUTTON ID="oBack" onclick="fnGo('back');" STYLE="position:absolute; top:460;">Back</BUTTON><br>

</BODY>
</HTML>

Will the BTTON ID of "oForward" have any effect on the pictures being all in the same space?

My css page now looks like this:

table {font-family: Arial; font-size: 16px; font-weight: normal; color:#ffffff;}
select, input {font-family: Arial; font-size: 16px; font-weight: normal; color:#ff0000;}

 
    .time    {behavior: url(#default#time2);}
    #oDiv1   
    {
    font-size:28pt;
    font-family: arial; 
    font-weight:bold;
    color: #000000;  
    background-color: #ffffcc;
    border:3px solid gold;
    position:absolute;
    top:20px;
    left:20px;
    height:300px;
    width:400px;
    padding:20px
    }
    #oDiv2
    {
    font-family: arial; 
    font-weight:bold;
    font-size: 28pt;
    background-color: #e4e4e4; 
    border:3px solid #666666;
    position:absolute;
    top:20px;
    left:20px;
    height:300px;
    width:400px;
    padding:20px;
    color:red
    }
    #oDiv3
    {
    color: white; 
    font-family: arial; 
    font-weight:bold;
    font-size: 28pt;
    background-color: #3366CC; 
    border:3px solid #666666;
    padding: 20;
    position:absolute;
    top:20px;
    left:20px;
    height:300px;
    width:400px;
    }

Should my css page have a head and body like:

<head>
<style type="text/css">
h1.css-section { color:#000099 }
p.css-section { color:#999999; }
</style>
</head>
<body>
<h1 class="css-section">CSS Class</h1>
<p class="css-section">CSS classes </p>
</body>

BTW: This is for my own website not some school project. I did find a book yesterday on line that I could afford and it should be here by the 18th. However all the help you can give is very Appreciated.

Sammy

My Information

Member Title:: New D.I.C Head
Age:: Age Unknown
Birthday:: Birthday Unknown
Gender:

Contact Information

E-mail:: Click here to e-mail me

Friends

ASamBrown hasn't added any friends yet.

Comments

ASamBrown has no profile comments yet. Why not say hello?