Our Services
MyBB Custom Theme
Web Design
Web Hosting
Logo and Branding
Psd to Template
Forum Management
# Contact UsWe are here for you.
+91-83340-25252 +91-83348-25252
# Request free QuoteWe'll come back with a price fast!
Please register and login BEFORE purchasing any products to avoid any type of purchase relates issues.
Using jQuery in MyBB themes
Posted by   Anurag M   on 05-21-2011 at 10:07 PM (This post was last modified: 05-21-2011 10:09 PM by Anurag M.)
Post: #1
Using jQuery in MyBB themes
In these days to get the maximum out of design you have to use jQuery and the most easiest process to get stunning effects in a web page. There are already many jQuery plug-ins available for use. Like we can use tooltip plug-in, many great menu effects also hover effects.

But using MyBB in jQuery theme is not easy, many designer can't get the jQuery plug-in to work with a MyBB theme, this happens because MyBB uses "Prototype JavaScript framework" not jQuery. Thats why Prototype conflict with jQuery and none of the scripts work properly. The solution of this problem is easy. There are various ways to modify a jQuery code and use it in a MyBB theme.

1. Using $.noConflict();

Code:
<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($)
  // You can put your jQuery code here with $ as function variable.
</script>

2. By overriding the $-function

Code:
<script>
     var $j = jQuery.noConflict();
    
     // Here we are changing the function name from $ to $j
     $j(document).ready(function(){
       $j("div").hide();
     });
    
     // We can use here Prototype with $ function name.
     $('someid').hide();
</script>

what we are doing here is changing the function name $ from $j so that it won't conflict with prototypes '$' function name.

3. Including jQuery before other libraries. (Most effective)

If we can include jQuery before other libraries, use jQuery while using jQuery and $ for other library. There is no need for overriding the $-function by calling "jQuery.noConflict()".

Code:
<script>
     // Replace the $ with jQuery(...)
     jQuery(document).ready(function(){
       jQuery("div").hide();
     });
    
     // Use Prototype with $(...), etc.
     $('some_id').hide();
  </script>


Hope by following the above methods many can overcome the problems they face while using jQuery plug-ins in MyBB themes.

Thanks for reading.

[Image: userbar-for-yuva-pix.png]
Support PMs will be Ignored!
Reply
Posted by   Ammy_769   on 05-21-2011 at 10:12 PM
Post: #2
RE: Using jQuery in MyBB themes
Well, once we ditched all old browser. CSS3 will replace it. Currently, not all browser support CSS3 that`s why developer use cross browser solution jQuery. It is difficult to implant, really messing with coding but give your animation for all browser regardless of how old it is? does not mean use ancient IE6.
Thanks for sum up. Developers will surely like it.
Reply
Posted by   Anurag M   on 05-21-2011 at 10:19 PM
Post: #3
RE: Using jQuery in MyBB themes
I have seen many posts in MyBB about this jQuery problem, thats why decided to write this tutorial. Hope it helps many MyBB themers as well as developers. Yes ammy jQuery is hard to apply but the features jQuery offer is awesome and once you familiar with the jQuery coding you just fell in love with it. There is so much can be done with jQuery.

[Image: userbar-for-yuva-pix.png]
Support PMs will be Ignored!
Reply
Posted by   ThinkChange   on 05-31-2011 at 01:44 PM
Post: #4
RE: Using jQuery in MyBB themes
OO What is for ? Drop down menu ?
Reply
Posted by   Anurag M   on 06-04-2011 at 02:22 PM
Post: #5
RE: Using jQuery in MyBB themes
(05-31-2011 01:44 PM)ThinkChange Wrote:  OO What is for ? Drop down menu ?

Its for all the jQuery plug-ins. By the method you can use jQuery in MyBB theme.

[Image: userbar-for-yuva-pix.png]
Support PMs will be Ignored!
Reply
Posted by   ThinkChange   on 06-05-2011 at 12:48 PM
Post: #6
RE: Using jQuery in MyBB themes
Hey is it possible that this could make the thread section which [-] this to slowly goes up or either goes down?
Reply
Posted by   Anurag M   on 09-13-2011 at 03:27 PM
Post: #7
RE: Using jQuery in MyBB themes
(06-05-2011 12:48 PM)ThinkChange Wrote:  Hey is it possible that this could make the thread section which [-] this to slowly goes up or either goes down?

Yes its possible, you could do that using a plug-in or you can code that yourself.

[Image: userbar-for-yuva-pix.png]
Support PMs will be Ignored!
Reply
Posted by   ambrizal   on 09-20-2011 at 04:34 PM
Post: #8
RE: Using jQuery in MyBB themes
please instert demo site
Reply
Posted by   Anurag M   on 09-20-2011 at 10:14 PM
Post: #9
RE: Using jQuery in MyBB themes
(09-20-2011 04:34 PM)ambrizal Wrote:  please instert demo site

In this tutorial we have stated the ways of integrating jQuery into MyBB themes, for example all our main site jQuery effects are integrated by this way.

[Image: userbar-for-yuva-pix.png]
Support PMs will be Ignored!
Reply
Posted by   newtonmaster   on 12-26-2011 at 06:38 AM (This post was last modified: 12-26-2011 06:39 AM by newtonmaster.)
Post: #10
RE: Using jQuery in MyBB themes
Good tutorial, a good technology to add effects in themes without weighing on the server. Thank you!
Reply




User(s) browsing this thread: 1 Guest(s)