|
Gathering related cases under this parent case.
Gathering related cases under this parent case.
Slight change to the script so that it's a bit more efficient when it's potentially added multiple times:
if (Liferay.Columns && !Liferay.Columns._ICE_positionSet) { Liferay.Util.actsAsAspect(Liferay.Columns); Liferay.Columns.after( 'add', function(portlet) { jQuery(portlet).css('position', 'static'); } ); Liferay.Columns._ICE_positionSet = true; } Added an extra check to the workaround so that errors are not logged when running in a portlet other than Liferay. Here's the new snippet:
if ( (typeof(Liferay) != 'undefined') ) { if (Liferay.Columns && !Liferay.Columns._ICE_positionSet) { Liferay.Util.actsAsAspect(Liferay.Columns); Liferay.Columns.after( 'add', function(portlet) { jQuery(portlet).css('position', 'static'); } ); Liferay.Columns._ICE_positionSet = true; } } how can i add this script to my app , where i should to ad this
It's JavaScript that needs to be added to any portlet that has a component with a positioning issue (e.g. menus). The JavaScript can either be inlined directly with <script> tags or added via a .js file.
In case I'm not wrong:
- this fix works for Liferay 5.0.1 - this fix does not work for Liferay 5.1 Do you know whether there's a fix for Liferay 5.1? Many thanks For Liferay 5.1, the Liferay.Publisher API is being removed (not deprecated) and replaced by Liferay.Events API. The Liferay developers provided this snippet of code that shows how to map the old API to the new one:
if (Liferay.Events && !Liferay.Publisher) { Liferay.Publisher = { deliver: function(publisher) { var data = Array.prototype.slice.call(arguments, 1); Liferay.trigger(publisher, data); }, register: function(publisher) { }, subscribe: function(publisher, func, obj) { Liferay.bind(publisher, function(event, data) { func.call(this, data); }, obj || window); }, unsubscribe: function(publisher, func) { Liferay.unbind(publisher, func); } }; } If you are moving to 5.1, you may want to consult Liferay's documenation about the Liferay.Events API so that you are using the officially recommended mechanism. Just capturing an additional comment from Liferay. Another suggestion was made to simply add the following style to the portlet content where the problem occurs:
.portlet-boundary { position: static !important; } |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
An example of the problematic style is:
<div class="portlet-boundary portlet-boundary_components_menubar_WAR_componentshowcase_" id="p_p_id_components_menubar_WAR_componentshowcase_INSTANCE_ZZpe_" style="top: 0pt; left: 0pt; position: relative;">
It's the position:relative that causes the grief with our own component positioning. The solution that was recommended to us directly from the Liferay UI development team involves adding a touch of JavaScript. This is the quote from Liferay:
"For more information about using this technique, check out my blog entry here:
http://www.liferay.com/web/ncavanaugh/home/blogs/hooking_into_liferay_s_javascript_functions
And here's the code:
if (Liferay.Columns) {
Liferay.Util.actsAsAspect(Liferay.Columns);
Liferay.Columns.after(
'add',
function(portlet) {
jQuery(portlet).css('position', 'static');
}
);
}
(Also, make sure this code runs outside of any sort of onLoad function)."