Customer Banners (Ads) - SpiceUp. AX and SpotfireX Disclaimer



If you find this site useful and you want to support, buy me a coffee   to keep this site alive and without ads.

Position Spotfire Controls freely




html
<style>
#aCalcVal{position:absolute;top:30px; left:122px;}
#aBulletGraph{position:absolute;top:608px; left:204.6875px;}
#aDropDown{position:absolute;top:141px; left:91.6875px;}
#anInput{position:absolute;top:563px; left:222.6875px;}
</style>

<IMG src="5487af1ed6ec4b8c90da59da34200d0f.png" border=0>

<span  id='aCalcVal'>
<SpotfireControl id="0ec42a6609d541308d42c406369df8d5" />
</span>

<span id='aBulletGraph'>
<SpotfireControl id="e57d92f8099c438b9a2a003b413fef37" />
</span>

<span id='anInput'>
<SpotfireControl id="0b36814498214275a80596860f6abcd7" />
</span>

<span id='aDropDown'>
<SpotfireControl id="9c8c9f42216a4efc8bb63ce81113d9d4" />
</span>


Optionally add this javascript tool to stop guessing top and left positions.

js
$(".drag").draggable({
 cursor:"move",
 drag:function(e){
p =  $(this).position() 
id = $(this).attr('id')
css = "#"+id+"{position:absolute;top:"+p.top+"px; left:"+p.left+"px;}"
$("#pos").text(css)  
 }
 ,refreshPositions :true,

}).css({border:"1px dashed blue",padding:"5px"})

This tool requires to add class='drag' to all elements you wish to move, for example:
<span class='drag' id='aDropDown'>
<SpotfireControl id="9c8c9f42216a4efc8bb63ce81113d9d4" />
</span>

It also requires a way to display the position:
<div id="pos">--</div>




2 comments:

Alex said...

I have some trouble getting this to work.
1) The HTML editor says that STYLE tags are not recognized
2) When playing around, Spotfire controls disappear

Jose Leviaguirre said...

Have your administrator turn off HTML sanitation for style and other tags to work.