.:: Blackc0de Forum ::.
Would you like to react to this message? Create an account in a few clicks or log in to continue.

-=Explore The World From Our Binary=-
 
HomeIndeksLatest imagesPendaftaranLogin

 

  Mengatasi Konflik jQuery dengan Mootools

Go down 
3 posters
PengirimMessage
zer03s
Administrator
Administrator
zer03s


Jumlah posting : 2471
Points : 4119
Reputation : 113
Join date : 13.12.10
Age : 31
Lokasi : /home/root/blackc0de

 Mengatasi Konflik jQuery dengan Mootools Empty
PostSubyek: Mengatasi Konflik jQuery dengan Mootools    Mengatasi Konflik jQuery dengan Mootools Icon_minitimeSun 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 :mmalu:
Kembali Ke Atas Go down
http://zer03s.blog.com/
S3r4f12
VIP Member
VIP Member
S3r4f12


Jumlah posting : 972
Points : 1538
Reputation : 113
Join date : 18.10.11
Age : 33
Lokasi : C:\Program error\User\Undefined

 Mengatasi Konflik jQuery dengan Mootools Empty
PostSubyek: Re: Mengatasi Konflik jQuery dengan Mootools    Mengatasi Konflik jQuery dengan Mootools Icon_minitimeSun Nov 20, 2011 3:04 am

Tak nyoba dlo Boz.. menuju TKP

:becak: :becak: :becak: :becak: :becak: :becak: :becak: :ngacir :ngacir
Kembali Ke Atas Go down
http://www.gagas-tewelz.com/
anom91
Corporal
Corporal
anom91


Jumlah posting : 170
Points : 186
Reputation : 2
Join date : 15.08.11
Age : 33
Lokasi : 127.0.0.1

 Mengatasi Konflik jQuery dengan Mootools Empty
PostSubyek: Re: Mengatasi Konflik jQuery dengan Mootools    Mengatasi Konflik jQuery dengan Mootools Icon_minitimeSun Nov 20, 2011 7:45 am

pas banget ne ama project yg ane kerjain skrg...
thanks om mimin...  Mengatasi Konflik jQuery dengan Mootools 271371
Kembali Ke Atas Go down
S3r4f12
VIP Member
VIP Member
S3r4f12


Jumlah posting : 972
Points : 1538
Reputation : 113
Join date : 18.10.11
Age : 33
Lokasi : C:\Program error\User\Undefined

 Mengatasi Konflik jQuery dengan Mootools Empty
PostSubyek: Re: Mengatasi Konflik jQuery dengan Mootools    Mengatasi Konflik jQuery dengan Mootools Icon_minitimeSun Nov 20, 2011 1:25 pm

anom91 wrote:
pas banget ne ama project yg ane kerjain skrg...
thanks om mimin...  Mengatasi Konflik jQuery dengan Mootools 271371

Sipz Slamat bekerja bkin projext,,,,.

Klo bsa buat 2 ya Bro.. satu bwat aku..
hahahaha

 Mengatasi Konflik jQuery dengan Mootools 1956393079  Mengatasi Konflik jQuery dengan Mootools 1956393079  Mengatasi Konflik jQuery dengan Mootools 1956393079  Mengatasi Konflik jQuery dengan Mootools 1956393079
Kembali Ke Atas Go down
http://www.gagas-tewelz.com/
zer03s
Administrator
Administrator
zer03s


Jumlah posting : 2471
Points : 4119
Reputation : 113
Join date : 13.12.10
Age : 31
Lokasi : /home/root/blackc0de

 Mengatasi Konflik jQuery dengan Mootools Empty
PostSubyek: Re: Mengatasi Konflik jQuery dengan Mootools    Mengatasi Konflik jQuery dengan Mootools Icon_minitimeSun Nov 20, 2011 7:01 pm

S3r4f12 wrote:
Tak nyoba dlo Boz.. menuju TKP

:becak: :becak: :becak: :becak: :becak: :becak: :becak: :ngacir :ngacir

silakan om :minta:

anom91 wrote:
pas banget ne ama project yg ane kerjain skrg...
thanks om mimin...  Mengatasi Konflik jQuery dengan Mootools 271371

makasih juga gan kalo bermanfaat  Mengatasi Konflik jQuery dengan Mootools 3529815765
Kembali Ke Atas Go down
http://zer03s.blog.com/
Sponsored content





 Mengatasi Konflik jQuery dengan Mootools Empty
PostSubyek: Re: Mengatasi Konflik jQuery dengan Mootools    Mengatasi Konflik jQuery dengan Mootools Icon_minitime

Kembali Ke Atas Go down
 
Mengatasi Konflik jQuery dengan Mootools
Kembali Ke Atas 
Halaman 1 dari 1
 Similar topics
-
» CodeIgneter(CI) with Mootools comment and preview
» kumpulan jquery
» JQUERY
» Mengatasi BootMGR is compressed
» Mengatasi masalah dalam Win-XP

Permissions in this forum:Anda tidak dapat menjawab topik
.:: Blackc0de Forum ::. :: Information Technology :: Framework-
Navigasi: