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   683 Views

Avatar
Richi

Community Member, 16 Posts

21 September 2012 at 2:36am

Edited: 21/09/2012 2:40am

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

Community Member, 18 Posts

21 September 2012 at 2:52am

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

Avatar
Richi

Community Member, 16 Posts

21 September 2012 at 2:59am

Edited: 21/09/2012 4:02am

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

Community Member, 18 Posts

21 September 2012 at 4:04am

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

Community Member, 16 Posts

21 September 2012 at 4:14am

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".