Javascript dependancy
Moderator: General Moderators
-
alex.barylski
- DevNet Evangelist
- Posts: 6267
- Joined: Tue Dec 21, 2004 5:00 pm
- Location: Winnipeg
Javascript dependancy
In a web application (which are typically centered at vertical markets) would you favour valid XHTML/CSS driven layouts which required Javascript to *render* properly in every browser?
Or would your prefer an HTML table layout which didn't depend on any javascript to render correctly but utilized excessive tables...
Remember I said web applications...not web sites...web sites which are more content heavy than functionality and also have a much wider potential audience it might make sense to limit interactivity in the sense of depending on javascript to properly render display...
I'm getting the feeling that eventually CSS will deprecate all HTML which would be better justifed in javascript...
Or would your prefer an HTML table layout which didn't depend on any javascript to render correctly but utilized excessive tables...
Remember I said web applications...not web sites...web sites which are more content heavy than functionality and also have a much wider potential audience it might make sense to limit interactivity in the sense of depending on javascript to properly render display...
I'm getting the feeling that eventually CSS will deprecate all HTML which would be better justifed in javascript...
I choose the other site with valid markup and without the javascript/active-x/flash/... requirements.. (Notice that there used to be a time that the html recommandation mentionned the table tag suitable for 'complex content'. So from that POV you can consider it as valid markup)
Since it's highly unlikely that you have a monopoly on your services/products i'm convinced that i can get what i want from a vendor that doesn't make me jump hoops...
Since it's highly unlikely that you have a monopoly on your services/products i'm convinced that i can get what i want from a vendor that doesn't make me jump hoops...
-
alex.barylski
- DevNet Evangelist
- Posts: 6267
- Joined: Tue Dec 21, 2004 5:00 pm
- Location: Winnipeg
-
alex.barylski
- DevNet Evangelist
- Posts: 6267
- Joined: Tue Dec 21, 2004 5:00 pm
- Location: Winnipeg
How is making javascript mandatory making you jump through hoops?timvw wrote:I choose the other site with valid markup and without the javascript/active-x/flash/... requirements.. (Notice that there used to be a time that the html recommandation mentionned the table tag suitable for 'complex content'. So from that POV you can consider it as valid markup)
Since it's highly unlikely that you have a monopoly on your services/products i'm convinced that i can get what i want from a vendor that doesn't make me jump hoops...
The way I see it...it's like this...advanced UI either require complex table nesting to get the layout just right...and make it work cross browser...
Or you can try and use CSS and struggle with it's downfalls...and have a less than desireable layout...
And/OR you can add some layout javascript code to the CSS mix and correct CSS short comings, such as DIV heights consuming the entire visible screen area...
If you think you can tackle any design/layout using strictly CSS and make it cross browser...
Can you please PM me...as I really would like to use CSS only, but I don't think it's possible given my design requirements, etc.
yea I'm with feyd on this one too... (kinda seems to be a trend
)
I am building a site that completely revolves around the Google maps API, so it is javascript-o-licious... but it doesn't require javascript for layout. Looks great... 100% css/div layout no tables. The only time I can justify javascript being mandatory is when your application would be pointless w/out it.
I am building a site that completely revolves around the Google maps API, so it is javascript-o-licious... but it doesn't require javascript for layout. Looks great... 100% css/div layout no tables. The only time I can justify javascript being mandatory is when your application would be pointless w/out it.
I was referring to the application I am building... which is completely reliant on javascript because google maps is built with javascript... not much I can really do about that...feyd wrote:I would say that application needs a better design (or better programmer) then.The Ninja Space Goat wrote:The only time I can justify javascript being mandatory is when your application would be pointless w/out it.
-
alex.barylski
- DevNet Evangelist
- Posts: 6267
- Joined: Tue Dec 21, 2004 5:00 pm
- Location: Winnipeg
I have a layout, which uses FRAMES
I have reasons to use frames...it's for a web application not a web site...so SEO isn't important.
If you have ever worked with Outlook, this layout will look familiar.
Frame B will look something like:
God that was annoying typing out...I should have just done it in my editor and pasted
ah well
Anyways, you can see the FRAME B is a tree control, similar to that found in many Windows programs...
The tabs at the bottom *MUST* be aligned with the bottom of the screen or it's parent and it's parent must be the height of it's parent, etc...
The tabs are aligned at the bottom for aesthetics only, but this cannot be accomplished through CSS alone as I have tried and tried to set the height using height: 100% and DIV's only seem to take the height of their content or their container height, but there is no way of making the ROOT element 100% the visible screen height, etc...that I could figure out anyways...
In 2 column designs or 3, etc...using CSS this is a common problem faced by many designers...as for aesthetics it looks nicer to have the entire column appear to render from top to bottom...but this cannot be done using strictly CSS
So many designers use a technique called faux columns where they use a background image and repeat it along the BODY of an HTML document...great for fixed columns....but i'm using FRAMES (for another technical reason) and therefore my columns aren't fixed...they're dynamic in width...
That and the fact that the TABS at the bottom of the CSS *should* be aligned to the bottom of the parent element...
If Javascript is disabled...those tabs are still visible and functional...but they kill the design if the tree is empty...and because I am using FRAMES...only the tree view section of the Frame B should be visible...the project drop down box should not be included in that scrolling window...so I need to be able to calculate the the height of the tree control and set display: scroll or something...
Anyways...I'm sure you get my point of what I am trying to do...
I would be super happy if someone showed me how I was wrong...or my design was flawed...but I don't think what I am trying to do is possible in CSS...without a mixture of javascript candy
Anyone???
Code: Select all
------------------------------------------
| Frame A |
|----------------------------------------|
| | |
| | |
| | |
| Frame | Frame C |
| B | |
| | |
| | |
| | |
------------------------------------------If you have ever worked with Outlook, this layout will look familiar.
Frame B will look something like:
Code: Select all
|-------------------------|
| My Projects: Test1 [^] |
|-------------------------|
| - Home |
| + Some Item |
| + Someother Items |
| - Show Child Items |
| + Some more Items |
| |
| |
| |
| |
| |
| |
---------------------------
| Tab 1 | Tab 2 | Tab 3 |
---------------------------Anyways, you can see the FRAME B is a tree control, similar to that found in many Windows programs...
The tabs at the bottom *MUST* be aligned with the bottom of the screen or it's parent and it's parent must be the height of it's parent, etc...
The tabs are aligned at the bottom for aesthetics only, but this cannot be accomplished through CSS alone as I have tried and tried to set the height using height: 100% and DIV's only seem to take the height of their content or their container height, but there is no way of making the ROOT element 100% the visible screen height, etc...that I could figure out anyways...
In 2 column designs or 3, etc...using CSS this is a common problem faced by many designers...as for aesthetics it looks nicer to have the entire column appear to render from top to bottom...but this cannot be done using strictly CSS
So many designers use a technique called faux columns where they use a background image and repeat it along the BODY of an HTML document...great for fixed columns....but i'm using FRAMES (for another technical reason) and therefore my columns aren't fixed...they're dynamic in width...
That and the fact that the TABS at the bottom of the CSS *should* be aligned to the bottom of the parent element...
If Javascript is disabled...those tabs are still visible and functional...but they kill the design if the tree is empty...and because I am using FRAMES...only the tree view section of the Frame B should be visible...the project drop down box should not be included in that scrolling window...so I need to be able to calculate the the height of the tree control and set display: scroll or something...
Anyways...I'm sure you get my point of what I am trying to do...
I would be super happy if someone showed me how I was wrong...or my design was flawed...but I don't think what I am trying to do is possible in CSS...without a mixture of javascript candy
Anyone???
have you tried:
Code: Select all
html, body{
height: 100%;
}
#your_box{
height: 100%;
}
-
alex.barylski
- DevNet Evangelist
- Posts: 6267
- Joined: Tue Dec 21, 2004 5:00 pm
- Location: Winnipeg
Edit: I'm back already...
that didn't work either...I'm convinced this is a case of required javascript. As i'm not willing to sacrifice interface for the sake of least common denominator. I like fancy GUI's...I think most people have JS enabled...and I would prefer an interface which gave me enhanced usability/efficiency over again...the LCD 
Unless this is possible in CSS...I'm afraid JS *with* CSS is required to have a proper display...it'll still work, just won't look as good I guess.
Unless this is possible in CSS...I'm afraid JS *with* CSS is required to have a proper display...it'll still work, just won't look as good I guess.
no sir I haven't but I will...so far only IE makes the DIV consume entire document height...which is a PITA...but i'll try setting HTML height to 100% and see what happensThe Ninja Space Goat wrote:have you tried:Code: Select all
html, body{ height: 100%; } #your_box{ height: 100%; }
so like I'm probably just misunderstanding what you're looking for,
but how does
not work?
but how does
Code: Select all
<div id="left" style="position: absolute; top 0%; left: 0%; width: 100%; height: 100%; background-color: #ff0000;">
Thing
<div id="bottom_of_left" style="position: absolute; top: 95%; left: 0%; width: 100%; height: 5%; background-color: #696969;">
Bottom
</div>
</div>