I want to allow only one scroll type at a time (vertical or horizontal) with ionic scroll component. I tried "locking" attribute at ion-scroll element but no luck. When I drag diagonally it happen like the following image.
Please help me if you know a way to solve this. Thanks in advance.
Sample Code - http://play.ionic.io/app/720567016712
<ion-content class="padding" overflow-scroll='false' locking="true" direction="xy" has-bouncing="false">
use this , Don't use ion-scroll now , remove it .. It will work as you want
Hope this helps you .. thanks
You can do it by using locking ="true"
and mention height and width for that ionic
Related
In bootstrap uib-collapse class animation behaviour hapeens only for vertical div.
But I need same animation/motion behaviour for table columns to show or hide upon click on icon.
For rightnow using ng-show and ng-hide but that doesnt seems animation behaviour not look good.
How can I achieve same behaviour for table colum wise NOT row
uib-collapse has a horizontal option and all you have to do is to add an additional attribute called 'horizontal' for the panel div as follows.
<div uib-collapse="isCollapsed" horizontal></div>
There is an issue recalling this problem and there is a workaround for it but as it's mentioned it's not recommended to use that.
Doing some further investigation, this appears to be a longstanding pre-existing issue with animating tr elements - my recommendation is to not do it. It seems that even when using vanilla Bootstrap JS, one has to hack around it too.
Here is a workaround that works - I am going to close this issue as not a fixable bug unfortunately. Thankfully, one can work around this, as my Plunker shows.
I'm using angular bootstrap https://angular-ui.github.io/bootstrap/ with class table-responsive. The problem is on the datepicker will display inside the table such as picture below:
I could fix it with:
.table-responsive {
overflow: visible;
}
and it will nicely work:
Now if I add the fix above, my display in mobile will end up like this:
It will not become scroll able and it will overflow my screen. How do I fix this?
Please help me and thanks in advance.
Use datepicker-append-to-body="true" with the popup version to have it linked to the body. It will appear above your table nicely.
Here it is, in a plunker.
After I called carousel page from menu, I want to display a specified carousel item.
I tried to use method like that
myCarsouselContent.setActiveCarouselItemIndex(index);
The problem is, carousel will slide step by step until index.
I don't want to show slide in screen. I think the best way is set value for initial-index = index. But I don't know how to do this.
Can someone help me?
EDIT: Changed my answer since there is an initial-index attribute which is better. Sorry about that.
Use initial-index="2" (or whatever index you like) as an attribute for <ons-carousel>.
<ons-carousel initial-index="2">
...
</ons-carousel>
Here you can see it in action:
http://codepen.io/argelius/pen/MYaGLK
Thanks for your support in advance. I am new to Angularstrap and I am using the popover directive in my application. I need to get the popover element so that I can make it resizable. I have tried jquery traversing to get the element as well as data(popover) with no success. Does anyone have any suggestions?
Please let me know.
Regards,
Sam
are you using angular-ui?
If so,
The element content can be get by angular.element('.popover-content') and you can set the width with
angular.element('.popover-content').css('width','200px')
Does anybody have a simple effective solution to fix a footer menu to the bottom of a viewport window? Absolute positioning appears to work in all but Iphone.
I thought that their should be a simple jquery or jquery touch script out there to do this, but I'm yet to find one!
Any advice greatfully received!
Cheers
Paul
Paul, you can achieve this by adding a footer with fixed-positioning, see
http://jquerymobile.com/demos/1.0a4.1/#docs/toolbars/bars-fixed.html
Just create a navbar within the footer for a menu, see
http://jquerymobile.com/demos/1.0a4.1/#docs/toolbars/docs-navbar.html
or alternatively
http://jquerymobile.com/demos/1.0a4.1/#docs/toolbars/docs-footers.html
Does this work. it grafts in win/safari...
http://jsfiddle.net/biznuge/stsfX/3/
good luck!