|
| Mengatasi Konflik jQuery dengan Mootools | |
| | Pengirim | Message |
---|
zer03s Administrator
Jumlah posting : 2471 Points : 4119 Reputation : 113 Join date : 13.12.10 Age : 32 Lokasi : /home/root/blackc0de
| Subyek: Mengatasi Konflik jQuery dengan Mootools Sun Nov 20, 2011 1:03 am | |
| Curhat sekaligus pengalaman pribadi nih, trik cupu emang dan di website resmi Jquery juga sudah dijelaskan masalah konflik antar jquery dengan library javascript yang lain. Ohya bagi yang belum tahu apa itu jquery dan mootools sedikit saya definisikan. Jquery dan Mootools merupakan salah dua framework dan library javascript. Definisi mudahnya seperti ini, javascript itu bahsa pemrogramannya, sedangkan jquery dan mootools itu perpustakaannya. Lebih jelasnya silahkan pelajari di situs resminya masing masing. jQuery -> [You must be registered and logged in to see this link.]Mootools -> [You must be registered and logged in to see this link.]Trus apa gunanya perpustakaan tersebut? yups gunanya adalah untuk mempersingkat dan mempermudah para programmer dalam membuat script javascript. Sebagai contoh jQuery menggunakan tanda $ sebagai shortcut untuk pemanggilan "jQuery", sedangkan MooTools menggunakan $() sebagai shortcut untuk mempersingkat document.getElementById(). Hasil dari penggunaan jquery ato mootools itu apa? yaaa halaman web dinamis yang anda lihat ini. Biasanya para developer hanya menggunakan salah satu dari kedua library javascript tersebut. ada yang tergila gila dengan jquery ada juga yang sangat setia dengan mootools. Nah kebetulan saia lagi ngopreks template blogspot/blogger, menu navigasi menggunakan Mootools, Pas pengen membuat tombol 'Back To Top' biar lebih ciamik saia menggunakan jQuery. walaah walah dalah ternyata setelah script saia pasang yang terjadi malah menu navigasi atas tidak berfungsi. Setelah gugling akhirnya nemu artikel ini [You must be registered and logged in to see this link.]Dan ternyata jika jquery dengan mootools disatukan dalam satu page akan terjadi konflik..akibat dari miripnya penggunaan kode seperti di atas. Untuk mengatasi konflik ini berdasarkan petunjuk artikel di atas saya hanya menyisipkan kode anti konflik yang dimiliki jquery yaitu kode: - Code:
-
<script type="text/javascript"> jQuery.noConflict(); </script> Jika kita aplikasikan ke dalam script yang kena konflik, Kode lengkapnya jadi kayak gini: - Code:
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
//** jQuery Scroll to Top Control script- (c) Dynamic Drive DHTML code library: http://www.dynamicdrive.com. //** Available/ usage terms at http://www.dynamicdrive.com (March 30th, 09') //** v1.1 (April 7th, 09'): //** 1) Adds ability to scroll to an absolute position (from top of page) or specific element on the page instead. //** 2) Fixes scroll animation not working in Opera.
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control //scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]}, controlHTML: '<img src="http://1.bp.blogspot.com/--nz1CM5CMlA/Tk1muKy2gaI/AAAAAAAAAIc/YI9UdYV-PkQ/s1600/top.jpg" style="width:30px; height:40px" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol" controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom of window corner anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false}, scrollup:function(){
if (!this.cssfixedsupport) //if control is positioned using JavaScript this.$control.css({opacity:0}) //hide control immediately after clicking it var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto) if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists dest=jQuery('#'+dest).offset().top else dest=0 this.$body.animate({scrollTop: dest}, this.setting.scrollduration); },
keepfixed:function(){ var $window=jQuery(window) var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety this.$control.css({left:controlx+'px', top:controly+'px'}) },
togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}
},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all
mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:'Scroll Back to Top'})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')
if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>
//script anti konfliknya <script type="text/javascript">
jQuery.noConflict();
</script>
beres dah, semoga bermanpaat | |
| | | S3r4f12 VIP Member
Jumlah posting : 972 Points : 1538 Reputation : 113 Join date : 18.10.11 Age : 34 Lokasi : C:\Program error\User\Undefined
| Subyek: Re: Mengatasi Konflik jQuery dengan Mootools Sun Nov 20, 2011 3:04 am | |
| | |
| | | anom91 Corporal
Jumlah posting : 170 Points : 186 Reputation : 2 Join date : 15.08.11 Age : 33 Lokasi : 127.0.0.1
| Subyek: Re: Mengatasi Konflik jQuery dengan Mootools Sun Nov 20, 2011 7:45 am | |
| pas banget ne ama project yg ane kerjain skrg... thanks om mimin... | |
| | | S3r4f12 VIP Member
Jumlah posting : 972 Points : 1538 Reputation : 113 Join date : 18.10.11 Age : 34 Lokasi : C:\Program error\User\Undefined
| Subyek: Re: Mengatasi Konflik jQuery dengan Mootools Sun Nov 20, 2011 1:25 pm | |
| | |
| | | zer03s Administrator
Jumlah posting : 2471 Points : 4119 Reputation : 113 Join date : 13.12.10 Age : 32 Lokasi : /home/root/blackc0de
| Subyek: Re: Mengatasi Konflik jQuery dengan Mootools Sun Nov 20, 2011 7:01 pm | |
| | |
| | | Sponsored content
| Subyek: Re: Mengatasi Konflik jQuery dengan Mootools | |
| |
| | | | Mengatasi Konflik jQuery dengan Mootools | |
|
Similar topics | |
|
| Permissions in this forum: | Anda tidak dapat menjawab topik
| |
| |
| Latest topics | » Baktrack TutorialSun Jul 28, 2019 2:26 am by kenta » aplikasi gambas pada linuxTue Apr 30, 2019 10:28 am by kenta » beli linux ubuntu terbaru di surabayaSun Mar 31, 2019 10:08 am by kenta » desain robotFri Jan 19, 2018 1:25 pm by kenta » membuat robot tidak susahFri Jan 19, 2018 1:15 pm by kenta » Salam.. Salam.. Salam..Thu Nov 30, 2017 7:42 am by BumiayuKita» teknologi penyaring udara dan airWed Oct 04, 2017 8:41 am by kenta » [CloudMILD] VPS SSD IIX 2X RAM + Xtra SSD SpaceMon Jul 24, 2017 10:46 am by BumiayuKita» cara menutup akses dari situs negatifTue Apr 04, 2017 1:04 pm by kenta » Aplikasi Google TalkMon Mar 20, 2017 3:00 am by BumiayuKita» Driver buat Webcam PC ?? merknya M-Tech,, Fri Jan 30, 2015 8:51 pm by aelgrim » Portal Blog,,,,,Sun Dec 14, 2014 12:38 am by robofics» Appteknodroid - Seputar Dunia AndroidMon Nov 10, 2014 11:32 pm by Pr0phecy » Software animasi yang agan2 pakeTue Sep 30, 2014 1:11 pm by X_campus » INDO BILLING 6.70 + KEYSun Sep 21, 2014 2:17 pm by abdul halim |
Statistics | Total 12294 user terdaftar User terdaftar terakhir adalah Adlygans
Total 31710 kiriman artikel dari user in 5734 subjects
|
Banner Forum | Dukung forum Blackc0de dengan memasang bannernya.
|
Social Networking |
|
|