ブートストラップツアーのダイアログをドラッグ可能にする

Question

解決：https://jsfiddle.net/shovas/jzs1uz0d/19/ドラッグ可能にするために間違った要素を選んでいたと思います。

どうすればいいですか？ブートストラップツアーダイアログはドラッグ可能ですか？

私はブートストラップツアーダイアログでのjQuery UIドラッグ可能を使用したいが、私は$('#dialog').draggable()何も変えていないようにみえ呼び出すとき。

Answer 1

私はそれがjsfiddle最初に動作するようになったし、私の実際のコードにそれを移植し、それが働いていたので、私は間違っている要素の上にドラッグを使用している必要があります。

https://jsfiddle.net/shovas/jzs1uz0d/19/

var tour = new Tour({ 
     element: '#step1', 
     name: 'tour', 
template: function (stepIndex, step) { 
     return "" + 
     "<div class='popover tour'>" + 
     "  <div class='arrow'></div>" + 
    " <div class='popover-header'>" + 
     " <h3 class='popover-title'></h3>" + 
    " </div>" + 
     " <div class='popover-content'></div>" + 
     "  <div class='popover-navigation'>" + 
    "   <button class='btn btn-default' data-role='prev'>« Prev</button>" + 
    "   <span data-role='separator'>|</span>" + 
    "   <button class='btn btn-default' data-role='next'>Next »</button>" + 
    " </div>" + 
     " <button class='btn btn-default' data-role='end'>End tour</button>" + 
       "</div>"; 
}, 
onShown: function (tour) { 
     console.log('onShown()') 
    var curStepIndex = tour.getCurrentStep(); 
    var curStep = tour.getStep(curStepIndex); 
    var targetElementSelector = tour._options.steps[curStepIndex].element; 
    var targetElement = $(targetElementSelector).get(0); 
    //$(targetElement).draggable(); 
    $('.popover.tour').draggable({ 
     handle: '.popover-header' 
    }); 
}, 
steps: [ 
     { 
         element: '#step1', 
         title: 'Step #1', 
    content: 'Lorem ipsum dolar sit amet Lorem ipsum dolar sit amet Lorem ipsum dolar sit amet Lorem ipsum dolar sit amet Lorem ipsum dolar sit amet Lorem ipsum dolar sit amet Lorem ipsum dolar sit amet.' 
    } 
] 
}); 
tour.init(); 
tour.start(); 

...snip...