I am having problems trying to drag a container (which is inside a navigationview) outside of the navigationview. Every time I try to do that, the container that is dragged disappears behind other components when it is dragged outside navigationview.
I have written a small fiddle that explains the problem that I'm facing:
https://fiddle.sencha.com/fiddle/d0
Is there a way I can make the container visible even outside the navigationview?
I've reproduced the code in your fiddle, copying and pasting it in a fresh Sencha Touch 2.2.1 app but I was not able to reproduce the issue. In my app, draggable components does not disappears behind the navigation view as in your fiddle.
The only difference between your fiddle and my working version is that I had to write the MyDroppable class in a separate js file and require it in the Main controller.
By the way, you can try to add
z-index: 1000;
to the style attribute of all the three draggable components.
sorry if this seems not to be a valid answer, but I've not yet the reputation score to post a comment
Related
I implemented a sticky sisebar library that aims to be easy to use as you are free in setting up the sidebar and its CSS. The library only gives you an additional value as custom property (--push-down) you can use in CSS to push the sidebar to its current position.
The problem I'm facing is that the script causes massive jitters in the sidebar position on some devices. These do only occur on the first scroll - if you've scrolled through the site once, it's working fine.
I would like to know why that could be the case (and if it's possible to be fixed. If not I still want to find out what's happening here.)
Using throttle functions does not make a difference here, as described here: https://stackoverflow.com/a/44779316/6336728. I'm already using the suggested method of doing layout read on scroll and layout write with requestAnimationFrame.
I put the code of my GitHub repo in this CodePen to try it out quickly; only the JS part is relevant.
I am currently developing a Webapp and I am trying to use QuillJS as a WYSIWYG Editor. I am trying to use the 'Bubble' theme as it fits nicely with the rest of my webapp, however when the tooltip is supposed to appear it does not appear on the screen and after checking using the Development console I found that the tooltip is being displayed with a Top value of somewhere around -700 to -1000 and I have absolutely no idea why.
I have tried using an element that was high-up in the HTML Heirarchy in case a parent div was messing something up but that did not solve my problem either.
Can anyone tell me why the tooltip appears so far off the screen?
Here is a JSFiddle with the current state of my code: https://jsfiddle.net/RBrNx/nwozxLzz/
Please Note: Most of my webapp does not function or look great in the JSFiddle, this is not an issue as most of the functionality involves a local database.
You may need the bounds option，set offset parent
bounds
I have a scrolling div that scrolls beautifully on iPad2 using -webkit-overflow-scrolling:touch;.
Inside, I have draggable elements using JQueryUI.draggable and TouchPunch to enable dragging via touch on mobile.
I'm so close to having it work perfectly, but I've found an issue. With divs set up like this, my JQueryUI draggable helper object won't float over-top everything else. With -webkit-overflow-scrolling off, it floats properly, but scrolls choppy.
Is there a way to have the best of both worlds?
Here's a JSBin, please view using an iPad or iPhone to see the problem!
Here's an EDITing view of the JSBin
Thanks in advance!
I figured it out, I just needed to make the draggable append the helper to body
$(element).draggable({appendTo: 'body'});
This JS Bin still works for posterity. Try this on iPad
Here's the code editing version
I am using dojo to render the panels on UI. I am facing one issue. All the panels get rendered on UI for few seconds(around 1~2 secs). After that I am getting a blank white screen. Now if I want to see the panels I've to do dragging the splitter OR maximize/restore that pane. I.e. basically I need to play with the width so as to get back the disappeared panels.Please suggest some solutions over this.
It would be better if you can provide more information in your question, your code is better. Otherwise, it is hard to tell what exactly cause this issue.
But you can try add resize call of the container of your panels somewhere after you startup this container.
Im trying to recreate the script that rdio (http://rdio.com) has created for their player footer. when you click on footer, a panel slides up nicely and to reveal more content. another example is by teehan lax; the top dropdown http://www.teehanlax.com/ but theirs doesn't support firefox properly.
I came across this snippet, http://www.dynamicdrive.com/dynamicindex17/dddropdownpanel.htm
But its not clean as rdio's or teehan.
any thoughts on library they might using?
We're just using basic CSS transitions, and adding and removing classes. The z-index of the bottom bar is set such that it appears in front of everything else, and the class changes control how the content is changed.
You can accomplish the same height changes with jQuery quite easily, as described here: https://stackoverflow.com/a/4965097/1309238