Hi,
Hoping someone can get this plug-in working within Oracle ApEx as unfortunately I can't seem to. I can though get it working outside of ApEx but when I attempt to do the following within a HTML Region (No Template), it doesn't seem to work.
I am using the jQuery Scroll Follow Plugin from :> http://kitchen.net-perspective.com/open-source/scroll-follow/
and I am specically trying to implement this example from the same website, i.e. :> http://kitchen.net-perspective.com/sf-example-2.html
Within ApEx, I can get the menu to appear but it doesn't follow me when I scroll down the page like it does in the example above, i.e example-2.
This is the code I have entered within the HTML Region (see below).
would really appreciate anyones help with getting this example-2 working within ApEx.
Thanks.
Tony.
ps
I think some of the code like the div id = "example2" has been stripped out but please see example-2 source code.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Simple Slide Panel</title>
<script type="text/javascript" src="#WORKSPACE_IMAGES#jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="#WORKSPACE_IMAGES#jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript" src="#WORKSPACE_IMAGES#jquery.scrollfollow.js"></script>
<script type="text/javascript">
$( document ).ready( function ()
{
$( '#example2' ).scrollFollow(
{
speed: 1000,
offset: 60,
killSwitch: 'exampleLink',
onText: 'Disable Follow',
offText: 'Enable Follow'
}
);
}
);
</script>
<style type="text/css">
body {
margin: 0;
padding: 0;
height: 3000px;
font-family: Georgia;
font-size: 0.9em;
line-height: 1.4em;
}
#example2 {
position: relative;
width: 180px;
margin: 10px;
padding: 20px 20px 20px;
background: #eee url(/images/sfbgTile.png);
border: 2px solid #42CBDC;
}
p {
margin: 7px 0 0 0;
}
a {
color: blue;
text-decoration: underline;
cursor: pointer;
}
</style>
</head>
<body>
<div id="example2">
<img src="/images/ducks2.png" alt="Ducks" />
<p>
This is an example of Scroll Follow using some parameters.
</p>
<p>
It should take one second
to animate the scroll. Click the link below to toggle the sliding on/off.
</p>
<p>
<a id="exampleLink">Default Text</a>
</p>
<p>
Back to Scroll Follow home.
</p>
</div><!--end #example-->
</body>
</html>
Edited by: Tony F. on Mar 22, 2009 11:30 PM