Rezinunts
01-13-2009, 09:49 PM
1) Script Title:
Tab Content Script (v 2.2)
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm
3) Describe problem:
I have a flash navigation movie I created. Here is the action script for one of the invisiblebutton layers:
----------------------------------
on (rollOver) {
_root.mouse_over_cube1 = true;
}
on (rollOut) {
_root.mouse_over_cube1 = fstartlse;
}
on (release){
getURL("about.html");
}
----------------------------------
Now rather than going to a new page (about.html) I was wondering if I could instead, expand to an arbitrary DIV on the page enabled as seen in Demo #2 of this script. Is this possible or is there an easier way I am not aware of to do this using flash and actionscript? Below is the code of the Tab Content Script.
----------------------------------
<h3>Demo #2- Different Tab Style, expanding of arbitrary DIVs on the page enabled</h3>
<div id="flowernote" style="display:none; position:absolute; right: 30px; width:150px; height:150px; background-color:red; color:white">
Arbitrary DIV 1
</div>
<div id="flowernote2" style="display:none; position:absolute; right: 200px; width:80px; height:80px; background-color:black; color:white">
Arbitrary DIV 2
</div>
<div id="flowernote3" style="display:none; position:absolute; right: 30px; width:140px; height:140px; background-color:navy; color:white">
Arbitrary DIV 3
</div>
<div style="border:1px solid gray; width:350px; height: 250px; background-color: #EAEAEA; padding: 5px">
<div id="tcontent1" class="tabcontent">
Tab content 1 here<br />Tab content 1 here<br />
</div>
<div id="tcontent2" class="tabcontent">
Tab content 2 here<br />Tab content 2 here<br />
</div>
<div id="tcontent3" class="tabcontent">
Tab content 3 here<br />Tab content 3 here<br />
</div>
<div id="tcontent4" class="tabcontent">
Tab content 4 here<br />Tab content 4 here<br />
</div>
</div>
<div id="flowertabs" class="modernbricksmenu2">
<ul>
<li><a href="#" rel="tcontent1" class="selected">Tab 1</a></li>
<li><a href="#" rel="tcontent2" rev="flowernote,flowernote2">Tab 2</a></li>
<li><a href="#" rel="tcontent3">Tab 3</a></li>
<li><a href="#" rel="tcontent4" rev="flowernote3">Tab 4</a></li>
<li><a href="http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm">Tab Content</a></li>
</ul>
</div>
<br style="clear: left" />
<script type="text/javascript">
var myflowers=new ddtabcontent("flowertabs")
myflowers.setpersist(true)
myflowers.setselectedClassTarget("link") //"link" or "linkparent"
myflowers.init()
</script>
<p><b><a href="javascript: myflowers.expandit(2)">Click here to select 3rd tab</a></b></p>
<p><b><a href="current.htm?flowertabs=1">Reload page and select 2nd tab using URL parameter</a></b></p>
<hr />
----------------------------------
I tried replacing "about.html" in the actionscript with "#" rel="tcontent1" but got compiler errors so obviously it's not as easy as that. Any help would be much appreciated.
Thanks!
R.Rezinunts
Tab Content Script (v 2.2)
2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm
3) Describe problem:
I have a flash navigation movie I created. Here is the action script for one of the invisiblebutton layers:
----------------------------------
on (rollOver) {
_root.mouse_over_cube1 = true;
}
on (rollOut) {
_root.mouse_over_cube1 = fstartlse;
}
on (release){
getURL("about.html");
}
----------------------------------
Now rather than going to a new page (about.html) I was wondering if I could instead, expand to an arbitrary DIV on the page enabled as seen in Demo #2 of this script. Is this possible or is there an easier way I am not aware of to do this using flash and actionscript? Below is the code of the Tab Content Script.
----------------------------------
<h3>Demo #2- Different Tab Style, expanding of arbitrary DIVs on the page enabled</h3>
<div id="flowernote" style="display:none; position:absolute; right: 30px; width:150px; height:150px; background-color:red; color:white">
Arbitrary DIV 1
</div>
<div id="flowernote2" style="display:none; position:absolute; right: 200px; width:80px; height:80px; background-color:black; color:white">
Arbitrary DIV 2
</div>
<div id="flowernote3" style="display:none; position:absolute; right: 30px; width:140px; height:140px; background-color:navy; color:white">
Arbitrary DIV 3
</div>
<div style="border:1px solid gray; width:350px; height: 250px; background-color: #EAEAEA; padding: 5px">
<div id="tcontent1" class="tabcontent">
Tab content 1 here<br />Tab content 1 here<br />
</div>
<div id="tcontent2" class="tabcontent">
Tab content 2 here<br />Tab content 2 here<br />
</div>
<div id="tcontent3" class="tabcontent">
Tab content 3 here<br />Tab content 3 here<br />
</div>
<div id="tcontent4" class="tabcontent">
Tab content 4 here<br />Tab content 4 here<br />
</div>
</div>
<div id="flowertabs" class="modernbricksmenu2">
<ul>
<li><a href="#" rel="tcontent1" class="selected">Tab 1</a></li>
<li><a href="#" rel="tcontent2" rev="flowernote,flowernote2">Tab 2</a></li>
<li><a href="#" rel="tcontent3">Tab 3</a></li>
<li><a href="#" rel="tcontent4" rev="flowernote3">Tab 4</a></li>
<li><a href="http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm">Tab Content</a></li>
</ul>
</div>
<br style="clear: left" />
<script type="text/javascript">
var myflowers=new ddtabcontent("flowertabs")
myflowers.setpersist(true)
myflowers.setselectedClassTarget("link") //"link" or "linkparent"
myflowers.init()
</script>
<p><b><a href="javascript: myflowers.expandit(2)">Click here to select 3rd tab</a></b></p>
<p><b><a href="current.htm?flowertabs=1">Reload page and select 2nd tab using URL parameter</a></b></p>
<hr />
----------------------------------
I tried replacing "about.html" in the actionscript with "#" rel="tcontent1" but got compiler errors so obviously it's not as easy as that. Any help would be much appreciated.
Thanks!
R.Rezinunts