掲示板
Fluid Layout (as Liferay Website) with AUI doesn't work
12年前 に Matthias Fenz によって更新されました。
Fluid Layout (as Liferay Website) with AUI doesn't work
Junior Member 投稿: 79 参加年月日: 09/03/24 最新の投稿
Hi all,
i'm trying to implement the fluid layout as used by the Liferay website. I installed Liferay 6.1 RC with Tomcat 7 from the download section. Then I posted the following script just before the </body> tag in my portal_normal.vm:
In my custom.css, I tried the follwoing code to test the functionality:
It doesn't work - and i don't know why...? When i checked my code with firebug, i found out, that the JS looks like this:
Could this be the reason and if yes, where should i place my JS code? Any help would be appreciated, thanks in advance,
Matthias
i'm trying to implement the fluid layout as used by the Liferay website. I installed Liferay 6.1 RC with Tomcat 7 from the download section. Then I posted the following script just before the </body> tag in my portal_normal.vm:
<script type="text/javascript" charset="utf-8">
AUI().use('aui-viewport');
</script>
In my custom.css, I tried the follwoing code to test the functionality:
.intro {
color: #123456;
}
.yui3-aui-view-lt720 .intro {
color: red;
}
It doesn't work - and i don't know why...? When i checked my code with firebug, i found out, that the JS looks like this:
/**/AUI().use('aui-viewport');/**/
Could this be the reason and if yes, where should i place my JS code? Any help would be appreciated, thanks in advance,
Matthias
12年前 に Juan Gonzalez P によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Liferay Legend 投稿: 3089 参加年月日: 08/10/28 最新の投稿Matthias Fenz:
Hi all,
i'm trying to implement the fluid layout as used by the Liferay website. I installed Liferay 6.1 RC with Tomcat 7 from the download section. Then I posted the following script just before the </body> tag in my portal_normal.vm:<script type="text/javascript" charset="utf-8"> AUI().use('aui-viewport'); </script>
In my custom.css, I tried the follwoing code to test the functionality:.intro { color: #123456; } .yui3-aui-view-lt720 .intro { color: red; }
It doesn't work - and i don't know why...? When i checked my code with firebug, i found out, that the JS looks like this:/**/AUI().use('aui-viewport');/**/
Could this be the reason and if yes, where should i place my JS code? Any help would be appreciated, thanks in advance,
Matthias
Not theme expert, but when I tested viewport from AUI, I had to place it at bottom part.
Did you import the needed alloy javascript to use that function?
If you are using latest sources there have been a change, I guess now AUI.use should be used (instead of AUI().use).
12年前 に Maarten van Heiningen によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Regular Member 投稿: 174 参加年月日: 09/02/05 最新の投稿
Hi Juan,
You were almost there. You just need to past this code inside the <head> .... </head>
Best Maarten
You were almost there. You just need to past this code inside the <head> .... </head>
<script type="text/javascript" charset="utf-8">
AUI().use('aui-viewport');
</script>
Best Maarten
12年前 に Matthias Fenz によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Junior Member 投稿: 79 参加年月日: 09/03/24 最新の投稿
Hi Guys, thanks a lot, it works!
But i have another question, when i check my theme on iPhone or iPad (both normal and panorama mode), i get the "normal" 960-width-layout and not the ones I developed for that. I think the browser doesn't get the real width of the frame.
Any idea how to override this, on Liferay's website it works perfectly?
Greets & Regards,
Matthias
But i have another question, when i check my theme on iPhone or iPad (both normal and panorama mode), i get the "normal" 960-width-layout and not the ones I developed for that. I think the browser doesn't get the real width of the frame.
Any idea how to override this, on Liferay's website it works perfectly?
Greets & Regards,
Matthias
12年前 に Bradley Wood によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
12年前 に Matthias Fenz によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Junior Member 投稿: 79 参加年月日: 09/03/24 最新の投稿
Thank you Bradley, it works!
12年前 に Bradley Wood によって更新されました。
Awesome lesson!
Thanks very much.
Hello Matthias would you mind sharing the solution I have the same problem as you describes above but I can't solve it no matter how I turn and twist the code.
I would really appreciate it thanks in advance!
Bahador
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
12年前 に Juan Gonzalez P によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Liferay Legend 投稿: 3089 参加年月日: 08/10/28 最新の投稿Bradley Wood:
no problem.
Have you taken a look at Liferay 6.1RC yet?
it lets you use SaSS which helps the code be simpler for mobile site design.@import "compass"; @mixin mobile($selector, $width) { .#{$selector}{ #wrapper, .portlet-column, #wrapper #content { width: $width !important; } } } $mobile-s: 300px; $mobile-m: 460px; $mobile-l: 700px; @include mobile("touch.aui-view-320, .touch.aui-view-4", $mobile-s); @include mobile("touch.aui-view-480", $mobile-m); @include mobile("touch.aui-view-720", $mobile-l);
Awesome lesson!
Thanks very much.
12年前 に Bradley Wood によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
11年前 に Bahador Vafadar によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
New Member 投稿: 23 参加年月日: 12/04/20 最新の投稿Matthias Fenz:
Thank you Bradley, it works!
Hello Matthias would you mind sharing the solution I have the same problem as you describes above but I can't solve it no matter how I turn and twist the code.
I would really appreciate it thanks in advance!
Bahador
11年前 に Muhammed Shakir AK Misarwala によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Junior Member 投稿: 36 参加年月日: 09/02/26 最新の投稿
Hi,
I also had the same problem but then the moment I changed from .yui... to simply .aui (syle names), it worked like a charm. I only used the aui-viewport module through AUI in main.js - thats it.
Hope this helps.
I also had the same problem but then the moment I changed from .yui... to simply .aui (syle names), it worked like a charm. I only used the aui-viewport module through AUI in main.js - thats it.
Hope this helps.
12年前 に Muller Strydom によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
New Member 投稿: 1 参加年月日: 12/01/24 最新の投稿
Hi Maarten,
I am still using Liferay 6.0.5
Is it possible to use AUI().use.. on 6.0.5??
Thank you.
I am still using Liferay 6.0.5
Is it possible to use AUI().use.. on 6.0.5??
Thank you.
12年前 に Maarten van Heiningen によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Regular Member 投稿: 174 参加年月日: 09/02/05 最新の投稿
Hi Muller,
Yes, Liferay 6 is supporting Alloyui fully so yes you can use it.
Best,
Maarten
Yes, Liferay 6 is supporting Alloyui fully so yes you can use it.
Best,
Maarten
11年前 に Rajesh Chaurasia によって更新されました。
RE: Fluid Layout (as Liferay Website) with AUI doesn't work
Regular Member 投稿: 183 参加年月日: 11/08/18 最新の投稿
Can you share me an example of fluid layout that you made ?