Any probable cause why my slider is being covered from other blocks (content,sidebar) even it's working behind them? - slideshow

I recently add HiSlider im my website.
I am using it at the front page an on 95% page loads the slider is being covered by the blocks of the page (which are supposed to be below,after, the slider).Sometimes on page load everything is working correctly.(I have the slider in an other page too link to a menu.By clicking the menu the slider in this page is working)
Any ideas?

have a look at the CSS z-index property.
#your-hi-slider-id{
z-index: 99;
}
Edit: I see this is not the problem you're having,
Because the page sometimes works, I believe the javascript may be excecuted before the page is ready
function init(){
//initialize your slider here
}
<body onload="init()">

Related

on-screen calculation with DA

when
:p1_radio_button_1
:p1_radio_button_2
:p1_radio_button_3
change,
dynamic actions fired to set values on
:p1_score_1
:p1_score_2
:p1_score_3
with simple math such as (:p1_lov_1's return value) * (a constant from global page) /100
and these changes on :p1_score_x fires another DA to do some other simple calculations.
eventually I am expecting a weighted_score to be calculated.
**
mechanically, it works. but when I click radio buttons a couple of times one after another, calculation goes crazy.
I believe my approach is wrong. What would you suggest? Should I submit the page after each radio button clicks?
Thanks in advance.
APEX version 18.x
browser Firefox
OS windows
I think chained dynamic actions are not the best idea. I changed the behaviour a little:
placed a dummyButton
hide realButton on page load
redirected dummyButton to page inline dialog saying to end user "please click calcButton"
show realButton when calcButton clicked
hide dummyButton when calcButton clicked
hide realButton & show dummyButton if anything changes on radioButtons
I wasn't sure if I should delete the post or reply it. admins; please delete if it somehow against the community rules.
thank you very much

icCube : how to show that a Big Widget is loading?

Using iccube 5.2, we developped a custom widget that needs quite BIG data download...
Unfortunately, when loading a report containing this widget, nothing is shown on the screen until it is loaded and users may think nothing happens...
How could I advise the user it is working, and he just has to wait ?
There are predefined styles for such case.
<div class="ic3-fixed-layout-box ic3-loading" style="width:200px; height:200px">
<div class="ic3-loading-div-back"></div>
</div>
This html will result in 200x200 px box with loading animation and blur effect.
So, to see loading effect class .ic3-loading should be added to the widget's parent container (with class .ic3-fixed-layout-box) while request is loading.
Check that your widget spawns with these classes before request send, and on request success just remove .ic3-loading class from parent element just like it is done for ic3 widgets.

cufon fonts do not work on all my pages

I have a problem with my page: on start page cufon-yui is loaded fine, but when I go to another page, it doesn't load. But when I refresh, it looks fine. I use turbolinks.
Turbolinks works by replacing the page content instead of navigating to a new page. If you're calling cufon-yui on document.ready, then it will NOT be called when you navigate to a new page. Your code should then look like:
$(document).on 'ready page:load', function(event)
{
Cufon.replace("whatever you're replacing");
// And whatever other Cufon code you're using is.
}
This way, it'll be called both when the document is ready, as well as when page:load is called by Turbolinks upon the completion of the page loading process.

EmberJS: how to show a background-image while the JS content is being downloaded?

Loading all the JS and CSS files can take a bit of time on a slow connection (e.g. mobile). So I was hoping to show a "loading…" image while it is happening. To be clear: the problem is not so much the initialisation of the Ember app itself, but the time it takes to download the content.
Is there a way to do this? It is not an Ember only issue, but I guess Ember developers may have been confronted to this as well?
I set a background-color and background-image to the <html> tag. When the app loads, I do see the background-color for a little while (before it gets covered by the <body> content), but not the background-image.
Thanks,
PJ
The background image may be taking time to load. The data may have finished loading before the image shows up.
For showing a loading spinner specifically for data loading, look into the recent async router changes. The beforeModel and afterModel hooks on the route are perfect for doing this.
beforeModel: function() {
// show spinner
}
afterModel: function() {
// hide spinner
}
Edit: Embedding the image with data-uri works.

Change width & height of APEX Page

I have a an APEX page which has a button on, when they click the button it opens another page on top of the main page, I'm trying to set the width and height of this popup window. I tried the following in the 'inline' box under the CSS section in the page properties but it doesnt overrule the main CSS like it says its suppose to, can anyone see any problems with it?
.body{
width:200px;
height:200px;
}
I dont really want to set it in the shared componants because i only need this IE window/page to be a specific size.
Will these sizes also set the size of the IE window or just the page?
You can't do this with CSS.
You could try to use the window.resizeTo function as seen here : Javascript set browser window size
Edit your popup page, and add the code to the "Execute when Page Loads" section: window.resizeTo(200,200);
I tried this in IE8 and firefox and it works.