www.webdeveloper.com
Results 1 to 9 of 9

Thread: Drag n drop not working

Hybrid View

  1. #1
    Join Date
    Feb 2012
    Posts
    12

    Drag n drop not working

    Trying to make my list items draggable and make my google map canvas the drop point. I feel like i have everything inorder for it to work but sadly enough it does not

    If anyone could help out with this i would be much appreciated.

    http://travismichael.net/mobile_app/map.html

  2. #2
    Join Date
    Feb 2012
    Location
    youTUBE
    Posts
    234
    The date picker works.

  3. #3
    Join Date
    Apr 2010
    Location
    Salem,Ma
    Posts
    623
    i dont see any javascript in there related to drag and drop functionality.

  4. #4
    Join Date
    Feb 2012
    Posts
    12
    Sorry I took it down after I realized it woulnt work with jquery mobile.

  5. #5
    Join Date
    Apr 2010
    Location
    Salem,Ma
    Posts
    623
    there are several drag n drop jquery mobile plugins.

  6. #6
    Join Date
    Feb 2012
    Posts
    12
    Would u mind posting them then please. I could not find any that worked with jquery mobile. Thanks

  7. #7
    Join Date
    Apr 2010
    Location
    Salem,Ma
    Posts
    623
    Quote Originally Posted by trav5567 View Post
    Would u mind posting them then please. I could not find any that worked with jquery mobile. Thanks
    hey, theres this new crazy site called google. it has all kinds of cool stuff on it.

    dude. search "drag and drop jquery mobile" and there are 3 plugins in the top 10 hits. c'mon.

  8. #8
    Join Date
    Sep 2011
    Posts
    11

    Im having using the jquery scrolling images

    I am having trouble getting the thumbnail scroll to move. Not sure what the problem is. I have add the jquery library in the proper folders.


    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Jewel Computer Brokers inc.</title>
    
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    
    <link href="css/jquery.thumbnailScroller.css" rel="stylesheet" type="text/css" />
    
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
    
    <script type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js">
    </script>
    
    
    </head>
    
    <body>
    
    
            
            <div id="container">
              
              
                
                
                <div id="wrapper">
                
                <div id="main_content">
                	
                    <div class="mainTop">
                    
                    <div id="sideNav">
                    	<div id="button1"><div>Service</div></div>
                        <div id="button2"><div>Hardware</div></div>
                        <div id="button3"><div>Software</div></div>
                    
                    </div><!--sideNav-->
                    <div id="mainBanner"></div>
                    
                    </div><!--mainTop-->
                    
                    <div id="home_content">
                    	<p>Satisfying your computer hardware and software needs since 1991. Jewel Computer Brokersí long term relationship in the computer marketplace enables us to provide you with a full range of computer hardware, software and, supplies. Our top notch service will afford you, the customer the luxury and peace of mind that all of your needs are being taken care of...<span>READ MORE</span></p>
                    
                    </div><!--home_content-->
                    
    
    
    
    
    
    <div id="tS2" class="jThumbnailScroller">
        <div class="jTscrollerContainer">
            <div class="jTscroller">
                <a href="#"><img src="images/demo/ibm.png" /></a>
                <a href="#"><img src="images/demo/motorola.png" /></a>
                 <a href="#"><img src="images/demo/ibm.png" /></a>
                <a href="#"><img src="images/demo/motorola.png" /></a>
                 <a href="#"><img src="images/demo/ibm.png" /></a>
                <a href="#"><img src="images/demo/motorola.png" /></a>
            </div>
        </div>
        <a href="#" class="jTscrollerPrevButton"></a>
        <a href="#" class="jTscrollerNextButton"></a>
    </div>
    
    
    
    
    
                    
                    
                </div><!--main_content-->
                
              
                
              </div><!--wrapper-->
              
              
              <div id="footerWrapper">
                
              </div><!--footerWrapper-->
                
                
                
         	<div id="nav_header">
              	
                <div id="navList">
                	
                    <ul id="nav1">
                        <li>HOME</li>
                        <li>ABOUT US</li>
                    </ul>
                    
                    <ul id="nav2">
                     	<li>SOLUTIONS</li>
                        <li>CONTACT</li>
                    </ul>   
                
                </div><!--navList-->
              	
                <div id="logo"></div>
               
              </div><!--nav_header-->	    
    	        
    </div><!--container-->
      
      
    
    
    
    <script>
    /* jQuery.noConflict() for using the plugin along with other libraries. 
       You can remove it if you won't use other libraries (e.g. prototype, scriptaculous etc.) or 
       if you include jQuery before other libraries in yourdocument's head tag. 
       [more info: http://docs.jquery.com/Using_jQuery_with_Other_Libraries] */
    jQuery.noConflict(); 
    /* calling thumbnailScroller function with options as parameters */
    (function($){
    window.onload=function(){ 
    	$("#tS2").thumbnailScroller({ 
    		scrollerType:"hoverAccelerate", 
    		scrollerOrientation:"horizontal", 
    		scrollSpeed:2, 
    		scrollEasing:"easeOutCirc", 
    		scrollEasingAmount:600, 
    		acceleration:4, 
    		scrollSpeed:800, 
    		noScrollCenterSpace:10, 
    		autoScrolling:20, 
    		autoScrollingSpeed:2000, 
    		autoScrollingEasing:"easeInOutQuad", 
    		autoScrollingDelay:500 
    	});
    	
    	$("#tS3").thumbnailScroller({
            scrollerType:"hoverPrecise",
            scrollerOrientation:"vertical",
            scrollSpeed:2,
            scrollEasing:"easeOutCirc",
            scrollEasingAmount:800,
            acceleration:4,
            scrollSpeed:800,
            noScrollCenterSpace:10,
            autoScrolling:0,
            autoScrollingSpeed:2000,
            autoScrollingEasing:"easeInOutQuad",
            autoScrollingDelay:500
        });
    
    }
    })(jQuery);
    </script>
    
        
    </body>
    </html>

  9. #9
    Join Date
    Oct 2010
    Location
    Versailles, France
    Posts
    1,276
    There is no need of jQuery to make draggable items. Take one of this script mouse draggable items or this for mobile

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles