Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

General Questions

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

(SOLVED, plz close/delete) Silverstripe and CrossSlide (jQuery), Urgent please help me!


Reply

5 Posts   629 Views

Avatar
Richi

21 September 2012 at 2:36am (Last edited: 21 September 2012 2:40am), Community Member, 16 Posts

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.

Avatar
n0ne

21 September 2012 at 2:52am Community Member, 18 Posts

It would be easier to help if U would provide a link for your page.

Avatar
Richi

21 September 2012 at 2:59am (Last edited: 21 September 2012 4:02am), Community Member, 16 Posts

The page is password protected and I dont want to give out access to everyone.
My Skype ID: richiibk

Okay got rid of all the errors now. Images still not displaying but should get along.

Avatar
n0ne

21 September 2012 at 4:04am Community Member, 18 Posts

no response on the skype,
btw... You should call your script using <% require javascript(mysite/code/lib/jquery.min.js) %>
<% require javascript(mysite/code/lib/jquery.cross-slide.min.js) %>, maybe that will help

Avatar
Richi

21 September 2012 at 4:14am Community Member, 16 Posts

hey, I did not receive a request.

BTW I solved it .... I am one fucking improperly working idiot.
Mispellings and similar crap ... mixing up code from 2 templates ... etc.

Sorry for the inconveniences I created, and thank you for the efforts you took "none".