I am trying to start my development in WebOS. I just started with a simple application with a label and a button. Here's the code snippet:
<div class="palm-body-text">
<div id="main" class="palm-hasheader">
<div class="palm-header">First Scene</div>
<div class="palm-text">Welcome to my World</div>
<div class="myButton" x-mojo-element="Button"></div>
</div>
</div>
In emulator it's not showing up the button. Also its giving a warning on button line which says
unknown attribute x-mojo-element.
Any suggestion?
You have to setup the button in the scene assistant first. The button is only rendered after you call this.controller.setupWidget in the scene assistant's setup function. Until you do that it's just a div without any special meaning.
Related
Im using the lastest version of fullpage.js(4.0.10).
I cannot suceed to put it on jsfidle license error block me to use CDN
so I put a really simple part of code here give a copy past it locally will reproduce the problem(and of course link back the fullpage.js and the fullpage.css).
so everything work fine until i click to the "button>a href=here" to go to the slide #here
then I can't scroll up at all I have to scroll all the way down and scroll one more time down to then be able to scroll up upper than the slide id "#here"
I want to be able to after I fire a link to an id element to scroll up.
<button type="button">here</button>
<h1>fullPage.js</h1></div>
<div class="section" id="section1">
<div class="slide" id="here"><h1>Simple Demo</h1></div>
<div class="slide"><h1>Only text</h1></div>
<div class="slide"><h1>And text</h1></div>
<div class="slide"><h1>And more text</h1></div>
</div>
<div class="section" id="section2">
<h1>No wraps, no extra markup</h1>
</div>
<div class="section" id="section3">
<h1>Just the simplest demo ever</h1>
</div>
</div>
code to run locally
The question has been answered here.
I paste:
You can use the anchors option to assign a different anchor to each section:
new fullpage('#fullpage', {
anchors: ['one', 'two', 'here', 'four'],
//your other options...
});
This way the #here anchor will be linked to the 3rd section.
https://jsfiddle.net/g26adykw/
The other option is just using the fullPage.js JS methods such as moveTo.
You can read more about anchors on the fullPage.js docs.
I want to use "semantic-ui" accordion with "rtl" icon in default accordion's icons looks like > and i want my accordions icons looks like this <
please help me to do this.
You can simply change the icon class that you are using to achieve your requirement.
I have used "angle left icon" for rtl. There are many more icon to show rtl, here is the link that contains list of supported icon by default in semantic.
<div class="ui styled accordion">
<div class=" title">
<i class="angle left icon"></i>
Title1
</div>
<div class="content">
<p>Title Content</p>
</div>
</div>
NOTE:
Make sure you are using icons from the correct version. Some of the legacy version icons doesn't work with the latest semantic version.
I'm using a drawer-panel from the core_elements, to display a side menu and a main part.
<core-drawer-panel>
<div drawer>
<core-menu selected="0">
<core-item icon="favorite" label="Menu Label"> </core-item>
</core-menu>
</div>
<div main>
<ng-view></ng-view>
</div>
</core-drawer-panel>
This work perfectly using both Dartium and Chrome, but in Firefox the views connected to ng-view get messed up. Removing the core-item helps to recover the layout in Firefox, but having a menu is convenient. Replacing the menu with a standard <ul> helps until you put a link in the list.
The following works fine:
<core-drawer-panel>
<ul class="menu">
<li><core-icon icon="favorite"></core-icon>Menu Label</li>
</ul>
...
While adding a link anywhere in the drawer-panel messes up the layout in Firefox.
Why would this behavior occur? Adding a ng-click to the item results in the same layout problems, as when using a link.
Since there are no tabs in jQuery Mobile yet, I'm trying to use the navbar to get a similar effect. Here's my HTML code:
<div data-role="navbar">
<ul>
<li><a data-page="desc" href="#" class="ui-btn-active">Description</a></li>
<li><a data-page="reviews" href="#">Reviews</a></li>
<li><a data-page="qanda" href="#">Q&A</a></li>
<li><a data-page="parts" href="#">Parts&Services</a></li>
</ul>
</div>
<div class="panes">
<div data-page="desc">Howdy desc</div>
<div data-page="reviews">Reviews</div>
<div data-page="qanda">You gots questions?!</div>
<div data-page="parts">Parts n stuff</div>
</div>
The problem is, for the life of me I cannot get any click handler to fire off on the iPad. I've tried attaching $.click() to the navbar li, the a tag.. NOTHING works. It works fine on the desktop and I can detect clicks in order to show/hide pages in the "panes" div. But on the iPad (our target), it does nothing. Totally stumped here. Am I missing something?
Try using the tap event rather than click: http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/docs/api/events.html
I have tried all the suggestions on here I just can't seem to get mine to pop-up in front of my stylesheet in IE. Works in firefox and chrome. Here is a very basic example of my layout.
the website is gulfstreamdata dot com . If you add anything to the cart and then in the top-right click on "expand" it drops down whats in your cart, but in IE it pops-under the template. :(
<div class="vmCartModule" style="position:relative; z-index:900; ">
<div id="dropdown" style="position:absolute; z-index:901;">
</div>
</div>
I tried making both z-index values the same and i tried making the outer div higher. Tried about everything I could think of in IE developer tools to no avail.
Anyway since it is positioned in a position you know, maybe you could detach it from the parent div, and move it after its actual parent div, so it will be drawn on front (also removing the z-index values).
<div class="vmCartModule">
</div>
<div id="dropdown" style="position:absolute; z-index:1;">
</div>
you shouldn't have problems in positioning it relative to the body, since it's on top right of the site.
EDIT
If it pops under your template, move that div to the bottom of your website, maybe right before </body>. I had the same issue with many menu and sub menus and it always worked perfectly.
Do this:
<div id="dropdown" style="position:absolute; z-index:901;">
//your content
</div>
<div class="vmCartModule" style="position:relative; z-index:900; ">
//your content
</div>
See demo in IE8 : http://jsfiddle.net/WtWqX/8/