Pacificus
03-11-2011, 02:40 AM
I’ve just found a JavaScript for a horizontal scrolling div, but have little idea as to how to position it in my webpage.
I know little of programming/coding and am working on my first website. I’ve never added a script/code to a web design before. I’ve managed to adapt the code slightly to open an embedded webpage. I just need to know how to add the code to my web page so that it will be positioned on that page where I want it to be in relation to other items (header, hyperlinks, etc.).
This is the JavaScript in question. Thanks for any help:
<html>
<head>
<title>Demo</title>
<style type="text/css">
div#wn {
position:relative;
width:425px; height:850px;
overflow:hidden;
}
</style>
<script src="js/dw_event.js" type="text/javascript"></script>
<script src="js/dw_scroll.js" type="text/javascript"></script>
<script src="js/scroll_controls.js" type="text/javascript"></script>
<script type="text/javascript">
function init_dw_Scroll() {
var wndo = new dw_scrollObj('wn', 'lyr1', 't1');
wndo.setUpScrollControls('scrollLinks');
}
// if code supported, link in the style sheet and call the init function onload
if ( dw_scrollObj.isSupported() ) {
//dw_Util.writeStyleSheet('css/scroll.css');
dw_Event.add( window, 'load', init_dw_Scroll);
}
</script>
</head>
<body>
<h1></h1>
<div id="wn">
<div id="lyr1">
<table id="t1" border="0" cellpadding="0" cellspacing="">
<tr>
<td><embed src="images/demo/index.html" width="832" height="803" alt="" /></td>
</tr>
</table>
</div>
</div> <!-- end wn div -->
<!-- border attribute added to reduce support questions on the subject.
If you like valid strict markup, remove and place a img {border:none;} spec in style sheet -->
<div id="scrollLinks">
<a class="mouseover_left" href="#"><img src="images/tri-lft.gif" alt="" border="0" /></a>
<a class="mouseover_right" href="#"><img src="images/tri-rt.gif" alt="" border="0" /></a>
</div>
</body>
</html>
I know little of programming/coding and am working on my first website. I’ve never added a script/code to a web design before. I’ve managed to adapt the code slightly to open an embedded webpage. I just need to know how to add the code to my web page so that it will be positioned on that page where I want it to be in relation to other items (header, hyperlinks, etc.).
This is the JavaScript in question. Thanks for any help:
<html>
<head>
<title>Demo</title>
<style type="text/css">
div#wn {
position:relative;
width:425px; height:850px;
overflow:hidden;
}
</style>
<script src="js/dw_event.js" type="text/javascript"></script>
<script src="js/dw_scroll.js" type="text/javascript"></script>
<script src="js/scroll_controls.js" type="text/javascript"></script>
<script type="text/javascript">
function init_dw_Scroll() {
var wndo = new dw_scrollObj('wn', 'lyr1', 't1');
wndo.setUpScrollControls('scrollLinks');
}
// if code supported, link in the style sheet and call the init function onload
if ( dw_scrollObj.isSupported() ) {
//dw_Util.writeStyleSheet('css/scroll.css');
dw_Event.add( window, 'load', init_dw_Scroll);
}
</script>
</head>
<body>
<h1></h1>
<div id="wn">
<div id="lyr1">
<table id="t1" border="0" cellpadding="0" cellspacing="">
<tr>
<td><embed src="images/demo/index.html" width="832" height="803" alt="" /></td>
</tr>
</table>
</div>
</div> <!-- end wn div -->
<!-- border attribute added to reduce support questions on the subject.
If you like valid strict markup, remove and place a img {border:none;} spec in style sheet -->
<div id="scrollLinks">
<a class="mouseover_left" href="#"><img src="images/tri-lft.gif" alt="" border="0" /></a>
<a class="mouseover_right" href="#"><img src="images/tri-rt.gif" alt="" border="0" /></a>
</div>
</body>
</html>