javascript - Properly containing draggable markers on videojs player -


I am working with javascript and videos and am relatively new to front-growth. I am currently working on a project where I want to allow users to specify points in a video through the use of dragable markers on the search of videos. I found the Video Marker Library from here: and made a simple amendment in my createmakers () function to create a dragable marker instead of a permanent marker.

  create the function () {// markers term duration, m, pause, text; Console.log ("[Video-marker] Marker"); Period = Player. Period (); $ .each (options.marker_breaks, function (key, time) {pos = (time / duration) * 100; m = $ ("& lt; div class = 'vjs-marker' id = '" + key + "' & Gt; & lt; / div & gt; "); m.css (settings.marker style) .css ({" margin-left ": -perseflat (m.css (" width ")) / 2 + 'px ',' Left ': pos +'% '}); // Start my additional meeting m.draggable ({containment:' .vjs-progress-holder '}); m.css ({' position ':' absolute '}); // My ADDITIONS END video_wrapper (). (). (). (): (= VJS-progress-control). Annex (m); text = option. Marker_text [key] || ""; markers Peash ({div: m, time: time, pos: pos, text: text});}); }   

However, when I try a draggable marker on the search bar, it is not really included in the bar. Markers can be pulled down under the watchman if I want to include them in divorce to find them instead, they can mess with the video. Here's the code to insert the marker:

    

I have not separated the CSS from the video-markers code from the above version. I may be able to include the marker more accurately but any help will be awesome!

Thank you! ~ Zoltana

Try using the "axis" property in draggable setup objects.

  m.draggable ({prevention: '.jjs-progress-holder', axis: 'x'});    

Comments

Popular posts from this blog

java - ImportError: No module named py4j.java_gateway -

python - Receiving "KeyError" after decoding json result from url -

.net - Creating a new Queue Manager and Queue in Websphere MQ (using C#) -