To begin, lets create a menu with which we to call the function, and some corresponding elements. We will use selectors and classes for this example.
I will try to keep code clean for this article, and this is most likely not the most elegant way to use chain events with animate, but this is what I did to achieve this.
The markup I will be using will look like this:
<body>
<div id="wrapper">
<div id="menu">
<li>
<a class="run" href="1" title="">Class 1</a>
<a class="run2" href="2" title="">Class 2</a>
</li>
</div>
<div id="images">
<div id="box1">
<a href="1">
<img src="../../assets/castandcrew/img/01.jpg" alt="aetuts" border="0" class="latest_img" />
<img src="../../assets/castandcrew/img/02.jpg" alt="aetuts" border="0" class="latest_img" />
<img src="../../assets/castandcrew/img/03.jpg" alt="aetuts" border="0" class="latest_img" />
<span class="class1span">3d models of <em>span text 1</em></span>
</div>
<div id="box2">
<a href="2">
<img src="../../assets/castandcrew/img/01.jpg" alt="aetuts" border="0" class="latest_img" />
<img src="../../assets/castandcrew/img/02.jpg" alt="aetuts" border="0" class="latest_img" />
<img src="../../assets/castandcrew/img/03.jpg" alt="aetuts" border="0" class="latest_img" />
<span class="class2span">3d models of <em>span text 2</em></span>
</div>
</div>
</div>
</body>
</html>
Note: I've replaced the closing tag > in the markup with & gts so that the code can be posted here. You will want to run a find and replace if you are using the markup. In the next post I will provide a simple style sheet formatting the markup.
No comments:
Post a Comment