Hey guys, I am sorry to ask for help but I am dealing with this issue since 5 days .. *shame on me*
It's not the first time I add a jQuery function but this time I can't get it working.
Problem description:
I am trying to use Cross Slide (http://tobia.github.com/CrossSlide/).
<b>But my Error Console always tells me that $(.'media').crossSlide is not a function.</b>
Please take a look at my code:
<!doctype html>
<head>
<% base_tag %>
<meta charset="UTF-8">
$MetaTags
<% require themedCSS(layout) %>
<% require themedCSS(typography) %>
<% require themedCSS(form) %>
<script src="mysite/code/lib/jquery.min.js"></script>
<script src="mysite/code/lib/jquery.cross-slide.min.js"></script>
</head>
<body>
<div id="head">
<div id="logo"><a href="/home"><img src="/themes/OIP/images/Logo_Odeon_Investment_Partners.png" /></a></div>
<div id="navi">
<ul>
<% control Menu(1) %>
<li class="$LinkingMode"><a href="$Link">$MenuTitle</a></li>
<% end_control %>
</ul>
</div>
</div>
<div id="wrapper">
<div id="media">
</div>
<div id="mediaoverlay"></div>
$Layout
<% include Footer %>
</div>
<script type="text/javascript">
$.noConflict();
(function($) {
$(document).ready(function() {
jQuery('#media').crossSlide({ /*Instead of $('#media') */
speed: 45,
fade: 1
}, [
{ src: 'themes/OIP/images/Odeon_picturemark.jpeg', dir: 'up' },
{ src: 'themes/OIP/images/Odeon_slogan.jpeg', dir: 'down' }
]);
})
})(jQuery)
</script>
</body>
</html>
I tried several solutions, from putting the whole function inside
(function($) {
})(jQuery);
,
use the no conflict thing, up to switch from
$('#media')
to jQuery('#media')
I'm desperate and I see no other possibilities to ask here, since I'm not able to solve this on my own.
Willing to pay someone to help me out, since my deadline is tomorrow and this is the only thing which is left to finish the page.
Beg you for help, regards.
Richi
/Edit I forgot to say this is SS 2.7.