Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>
- <script>
- jQuery(document).ready(function($){
- $( "#ov-draggable-1" ).draggable();
- $( "#ov-draggable-2" ).draggable();
- $( "#ov-draggable-3" ).draggable();
- $( "#ov-draggable-4" ).draggable();
- $( "#ov-droppable" ).droppable({
- classes: {
- "ui-droppable-active": "ov-droppable-activo",
- "ui-droppable-hover": "ov-droppable-hover"
- },
- drop: function( event, ui ) {
- $( this ).addClass( "ov-droppable-resaltado" );
- $( ".ui-draggable-dragging" ).addClass( "ov-draggable-resaltado" );
- if (ui.draggable.attr('id') == 'ov-draggable-1') {
- $('html, body').animate({
- scrollTop: $("#diseno-web").offset().top - 140
- }, 2000);
- }
- if (ui.draggable.attr('id') == 'ov-draggable-2') {
- $('html, body').animate({
- scrollTop: $("#diseno-grafico").offset().top - 140
- }, 2000);
- }
- if (ui.draggable.attr('id') == 'ov-draggable-3') {
- $('html, body').animate({
- scrollTop: $("#marketing-digital").offset().top - 140
- }, 2000);
- }
- else if (ui.draggable.attr('id') == 'ov-draggable-4') {
- $('html, body').animate({
- scrollTop: $("#community-manager").offset().top - 140
- }, 2000);
- }
- },
- out: function( event, ui ) {
- $( this ).removeClass( "ov-droppable-resaltado" )
- $( ".ui-draggable-dragging" ).removeClass( "ov-draggable-resaltado" );
- }
- });
- } );
- </script>
- <script>
- // Remover draggable resaltado al hacer scroll
- jQuery(document).ready(function( $ ) {
- $(window).scroll(function(){
- var scroll = jQuery(window).scrollTop();
- if (scroll >= 800) {
- $( ".ui-draggable" ).removeAttr("style");
- $( ".ui-draggable" ).removeClass( "ov-draggable-resaltado" );
- }
- });
- });
- </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement