We can put tags where ever, right?



  • I just stumbled across this while in the midst of sprucing up this app to make it work in newer versions of IE (And other browsers as well:

    Every time I don't think that the "guru" that wrote this app initially could get worse... I should also note that there are 271  's there.



  • What is that span spanning?



  • @eViLegion said:

    What is that span spanning?

    It appears to be the container for a block of HTML returned from an AJAX call. Well, not really AJAX:

    var oHTTP = new ActiveXObject("Msxml2.XMLHTTP.6.0");
    oHTTP.open("POST", sURL, false);
    oHTTP.send(sXML);
    

    var sResponseText = oHTTP.responseText;

    I point to the third parameter in open(), which tells the request to be synchronous. The span should probably really be a div, the whole thing is going away anyhow. It uses the odd modalPopup thing in IE to open this window in, and that's getting migrated to an overlay div.


  • Discourse touched me in a no-no place

    @bardofspoons42 said:

    The span should probably really be a div, the whole thing is going away anyhow.
    Just use CSS to reconfigure it to work that way…



  • @dkf said:

    @bardofspoons42 said:
    The span should probably really be a div, the whole thing is going away anyhow.
    Just use CSS to reconfigure it to work that way…

    div {
      display: inline;
    }
    
    span {
      display: block;
    }


  • @bardofspoons42 said:

    I point to the third parameter in open(), which tells the request to be synchronous.
    So he invented ... uh ... "JAX"?



  • @Anonymouse said:

    @bardofspoons42 said:

    I point to the third parameter in open(), which tells the request to be synchronous.
    So he invented ... uh ... "JAX"?



  • One of the things I really used to hate is when devs would ignore the big red underline in <insert IDE of choice> when the markup was incorrect. I said to one dev "look it not right that is why it isn't rendering correctly", his response "it rendering in Chrome alright, must be IE's fault for being shitty".



  • @bardofspoons42 said:

    I just stumbled across this while in the midst of sprucing up this app to make it work in newer versions of IE (And other browsers as well:

     

    HTML rape jokes are never funny.

     



  • @morbiuswilters said:

    @dkf said:
    @bardofspoons42 said:
    The span should probably really be a div, the whole thing is going away anyhow.
    Just use CSS to reconfigure it to work that way…

    div {
      display: inline;
    }
    

    span {
    display: block;
    }

    Wait, you can DO that?

    From now on, I'm going to put

    div {
    display: inline;
    }

    span {
    display: inline;
    }

     in all of my CSS, and then just use div and span interchangeably, and watch someone's face get red when they try and understand my HTML.

     



  • @drurowin said:

    Wait, you can DO that?
    Of course. Almost any element can be given almost any valid display style, and CSS will happily apply it. (There are some exceptions - replaced elements [eg. images] can't become truly inline, and will act as inline-block.)@drurowin said:
    just use div and span interchangeably
    That won't always do what you want, as they affect parsing differently. For example, a SPAN tag inside a P will nest the span inside the paragraph, but a DIV inside a P will automatically close the paragraph, so the paragraph and div become siblings. That is mandated by HTML parsing rules, not CSS.

    If it's added by DOM manipulation, it bypasses the parser restriction though, so DOM manipulation can happily add an element inside any other element, even if it would not have been allowed by the HTML parser. That is why the script in the OP's post would in fact have been allowed to add anything it wanted into that poor span.





  • div {
    display: inline-block;
    }

    span {
    display: table;
    }

    Fuck 'em. 

     

     



  • Or for the ones who have heard that layout tables are evil, and think that all tables are evil even when they are being used for tabular data:

    span { display: table; }
    span span { display: table-row; }
    span span span { display: table-cell; }
    span.header { font-weight: bold; }
    ...
    <span>
    <span>
    <span class="header">Foo</span><span class="header">Bar</span>
    </span>
    <span>
    <span>1.1</span><span>17</span>
    </span>
    <span>
    <span>0.333</span><span>37</span>
    </span>
    </span>



  • @TarquinWJ said:

    span
     

    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan



  • Egg, bacon, sausage and
    @dhromed said:

    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    ?



  • @ender said:

    Egg, bacon, sausage and
    @dhromed said:
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    spanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspanspan
    ?
     

    That's a lot of pans.



  • @Lorne Kates said:

    That's a lot of pans.
     

    @ender said:

    Egg, bacon, sausage
     

    I am suddenly very hungry.



  • @dhromed said:

    @Lorne Kates said:

    That's a lot of pans.
     

    @ender said:

    Egg, bacon, sausage
     

    I am suddenly very hungry.

     



  • @TarquinWJ said:

    Or for the ones who have heard that layout tables are evil, and think that all tables are evil even when they are being used for tabular data:

    span { display: table; }
    span span { display: table-row; }
    span span span { display: table-cell; }
    span.header { font-weight: bold; }
    ...
    <span>
    <span>
    <span class="header">Foo</span><span class="header">Bar</span>
    </span>
    <span>
    <span>1.1</span><span>17</span>
    </span>
    <span>
    <span>0.333</span><span>37</span>
    </span>
    </span>

     

    You know what is scary, back in 2008 I saw jQuery plugins that would actually make a sortable table or some shit from an unordered list.

     



  • @lucas said:

    You know what is scary, back in 2008 I saw jQuery plugins that would actually make a sortable table or some shit from an unordered list.
    The example I gave is also a real example. I have seen it used for a calendar, on a page that insisted it was valid HTML (hey, it validates, and that's what matters, right?). You know, a calendar. Something that is about as close to the perfect use for a table as its possible to be. Visually it looked perfect. It was only when you tried to use something that attempted to interpret the semantics of it (some screen reader software, as it happens), the entire thing just turned into a long blabbering sentence of:

    January Sunday Monday Tuesday Wednesday Thursday Friday Saturday 26 27 28 29 30 31 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 1 2 3 4 5


    Not to mention that it also looked like that in IE 7-, which was still of significance back then.



  • There are a lot of people that don't care that it validates, and there are people that don't care why it validates. They are both numerous.



  • @lucas said:

    You know what is scary, back in 2008 I saw jQuery plugins that would actually make a sortable table or some shit from an unordered list.
    Confession time: Quite recently, I made a GWT widget that acts as a replacement for a listbox, but is actually just an <ul> with CSS coating and a bunch of event handlers...



  • @Anonymouse said:

    Confession time: Quite recently, I made a GWT widget...

    You get the hell out of my confessional. You make me sick.



  • @Anonymouse said:

    Confession time: Quite recently, I made a GWT widget that acts as a replacement for a listbox, but is actually just an <ul> with CSS coating and a bunch of event handlers...
    Is it keyboard-accessible?



  • @ender said:

    @Anonymouse said:
    Confession time: Quite recently, I made a GWT widget that acts as a replacement for a listbox, but is actually just an <ul> with CSS coating and a bunch of event handlers...
    Is it keyboard-accessible?
    As a matter of fact, it is.

    @morbiuswilters said:

    You get the hell out of my confessional. You make me sick.
    Don't worry, I didn't touch any of your choir boys. I'm not into that kind of thing.



  • Look ma, no JavaScript!

    See? I can create a horrible user experience even without client-side scripting.



  • @Ben L. said:

    Look ma, no JavaScript!

    See? I can create a horrible user experience even without client-side scripting.

    FAIL it's not even horrible. You have to make it worse than the Ajax Toolkit Dropdown widget[1] to qualify as horrible.



    [1] you'd think that you can customize the look, such as right-aligning the drop-down panel, but to do that you have to update a JS file then recompile a DLL.



  • @Ronald said:

    @Ben L. said:
    Look ma, no JavaScript!

    See? I can create a horrible user experience even without client-side scripting.

    FAIL it's not even horrible. You have to make it worse than the Ajax Toolkit Dropdown widget[1] to qualify as horrible.



    [1] you'd think that you can customize the look, such as right-aligning the drop-down panel, but to do that you have to update a JS file then recompile a DLL.

    Forget the invisible right-aligned dropdown. What the fuck is the three frame animation when I expand or collapse a section of the documentation?



  • @Ben L. said:

    @Ronald said:
    @Ben L. said:
    Look ma, no JavaScript!

    See? I can create a horrible user experience even without client-side scripting.

    FAIL it's not even horrible. You have to make it worse than the Ajax Toolkit Dropdown widget[1] to qualify as horrible.



    [1] you'd think that you can customize the look, such as right-aligning the drop-down panel, but to do that you have to update a JS file then recompile a DLL.

    Forget the invisible right-aligned dropdown. What the fuck is the three frame animation when I expand or collapse a section of the documentation?

    What you just experienced is the collapsible panel extender which is also part of that majestic toolkit.



  • @TarquinWJ said:

    If it's added by DOM manipulation, it bypasses the parser restriction though, so DOM manipulation can happily add an element inside any other element, even if it would not have been allowed by the HTML parser.

    This is quite an old pattern. Apple Integer BASIC did most of its syntax checking as you entered your code, and that syntax checker imposed more limitations than the interpreter itself did; for example, Integer BASIC was quite capable of handling GOTO expression at runtime even though the parser only allowed fixed line numbers as GOTO targets. If I recall correctly, this was a discovery first exploited by Bruce Tognazzini, one of whose demos featured a "code poker" subroutine a program could call to inject tokenized code directly into its own text.

    Not as formalized as the DOM, but then again the Apple II did have only 8K of ROM.



  • @Ronald said:

    @Ben L. said:
    @Ronald said:
    @Ben L. said:
    Look ma, no JavaScript!

    See? I can create a horrible user experience even without client-side scripting.

    FAIL it's not even horrible. You have to make it worse than the Ajax Toolkit Dropdown widget[1] to qualify as horrible.



    [1] you'd think that you can customize the look, such as right-aligning the drop-down panel, but to do that you have to update a JS file then recompile a DLL.

    Forget the invisible right-aligned dropdown. What the fuck is the three frame animation when I expand or collapse a section of the documentation?

    What you just experienced is the collapsible panel extender which is also part of that majestic toolkit.

    Fuck you, Microsoft. Some kid just built the thing your engineers spent months on with half the technologies.



  • @Ben L. said:

    Fuck you, Microsoft. Some kid just built the thing your engineers spent months on with half the technologies.
    That doesn't work at all for me. Chrome Version 27.0.1453.116 m on Windows.

    EDIT: Now it is, weird.



  • @electronerd said:

    @Ben L. said:
    Fuck you, Microsoft. Some kid just built the thing your engineers spent months on with half the technologies.
    That doesn't work at all for me. Chrome Version 27.0.1453.116 m on Windows.

    Thank you for your very detailed bug report. From what I can tell, the problem is caused by issues. I have taken steps to start to pretend to solve the problem you failed to describe.

    RESOLVED FIXED



  • @Ben L. said:

    @electronerd said:
    @Ben L. said:
    Fuck you, Microsoft. Some kid just built the thing your engineers spent months on with half the technologies.
    That doesn't work at all for me. Chrome Version 27.0.1453.116 m on Windows.

    Thank you for your very detailed bug report. From what I can tell, the problem is caused by issues. I have taken steps to start to pretend to solve the problem you failed to describe.

    RESOLVED FIXED

    How come the last 10 tokens take a while longer to expand?



  • I was going to@Ben L. said:

    @electronerd said:
    @Ben L. said:
    Fuck you, Microsoft. Some kid just built the thing your engineers spent months on with half the technologies.
    That doesn't work at all for me. Chrome Version 27.0.1453.116 m on Windows.

    Thank you for your very detailed bug report. From what I can tell, the problem is caused by issues. I have taken steps to start to pretend to solve the problem you failed to describe.

    RESOLVED FIXED

    I realized that and was about to supply more info and a screen shot, but then it started working, so PEBKAC probably.



  • @Ben L. said:

    @electronerd said:
    @Ben L. said:
    Fuck you, Microsoft. Some kid just built the thing your engineers spent months on with half the technologies.
    That doesn't work at all for me. Chrome Version 27.0.1453.116 m on Windows.

    Thank you for your very detailed bug report. From what I can tell, the problem is caused by issues. I have taken steps to start to pretend to solve the problem you failed to describe.

    RESOLVED FIXED

    Holy shit, now he's re-implemented the MSDN forums. Kid's on fire!



  • @Ronald said:

    Ajax Toolkit Dropdown widget[1]
     

    I love how the highlighted style is a few pixels wider than the non-highlighted style. So as you mouse over an item, the menu jerks around as it expands a few pixels. Then since there's a gap between items, the highlight style vanishes briefly as you move vertically between items-- and of course the menu contracts.

     Mouse up and down between items, and the menu jerks all around like an epileptic stingray having it's internal genitals pummeled by an electric eel.

    And best of all it took me a good 30 seconds to realize where the fuck the demo even was.  It turns the dropdown control into plain text when you aren't hovering over it. Because nothing says usability like stripping away all the industry-standard interaction hints people have built up decades worth of muscle memory on.

    Fuck I hate this pile.


  • Discourse touched me in a no-no place

    @Lorne Kates said:

    @Ronald said:

    Ajax Toolkit Dropdown widget[1]
     

    I love how the highlighted style is a few pixels wider than the non-highlighted style. So as you mouse over an item, the menu jerks around as it expands a few pixels. Then since there's a gap between items, the highlight style vanishes briefly as you move vertically between items-- and of course the menu contracts.

     Mouse up and down between items, and the menu jerks all around like an epileptic stingray having it's internal genitals pummeled by an electric eel.

    I didn't get that (FF25 or Chrome 27.whatever).

    @Lorne Kates said:

    And best of all it took me a good 30 seconds to realize where the fuck the demo even was.  It turns the dropdown control into plain text when you aren't hovering over it. Because nothing says usability like stripping away all the industry-standard interaction hints people have built up decades worth of muscle memory on.
    That, OTOH, is something worthy of a cluebat.



  • @Lorne Kates said:

    @Ronald said:

    Ajax Toolkit Dropdown widget[1]
     

    I love how the highlighted style is a few pixels wider than the non-highlighted style. So as you mouse over an item, the menu jerks around as it expands a few pixels. Then since there's a gap between items, the highlight style vanishes briefly as you move vertically between items-- and of course the menu contracts.

     Mouse up and down between items, and the menu jerks all around like an epileptic stingray having it's internal genitals pummeled by an electric eel.

    What browser did you use (I'm guessing some version of IE)? I didn't get any of that in IE8, chrome, firefox, opera or rekonq. Maybe it's your ad blocker doing this to you?



  • @Lorne Kates said:

    Because nothing says usability like stripping away all the industry-standard interaction hints people have built up decades worth of muscle memory on.
    Try selecting something with keyboard (not much of a problem in a list with 3 items, but when you have 50...)


  • Discourse touched me in a no-no place

    @ender said:

    @Lorne Kates said:
    Because nothing says usability like stripping away all the industry-standard interaction hints people have built up decades worth of muscle memory on.
    Try selecting something with keyboard (not much of a problem in a list with 3 items, but when you have 50...)
    The control previously mentioned isn't keyboard accessible - can't even tab to it. Most other dropdowns usually allow you to type the first few letters of something into it, so - for example - country dropdowns that don't have the common ones repeated at the top allow you to type in "united" and you're immediately near the UK, (sometimes) US (and UAE.)



  • @PJH said:

    The control previously mentioned isn't keyboard accessible - can't even tab to it. Most other dropdowns usually allow you to type the first few letters of something into it, so - for example - country dropdowns that don't have the common ones repeated at the top allow you to type in "united" and you're immediately near the UK, (sometimes) US (and UAE.)
    I'm well aware of this - why do you think I mentioned it? :)



  • @boomzilla said:

    What browser did you use (I'm guessing some version of IE)?
     

    AHAHAHAHAHAHAHAHAHAHAHAHAHAHAHAHHAHAHAHAHAHAHAHA!

    @boomzilla said:

    I didn't get any of that in IE8, chrome, firefox, opera or rekonq. Maybe it's your ad blocker doing this to you?

    Nope, specifically disabled all that to test. I just tried again, and it turns out it's the zoom level. Viewing on a 1080p monitor, so I zoomed in so I could actually read the text. Zoom I THINK is 150%, but as always I can't tell because Firefox devs are retarded and don't provide any indication as to what the current zoom level is. (Seriously, View -> Zoom, and all you see is zoom+ and zoom-, not 100%, 120%, 130% with a dot next to it).

    I know the ATK devs couldn't have possible forseen that someone might ZOOM their browser. I know there's no way they could have zoomed their own browser to test. And I know there's no way they could use css styles that work properly when zoomed. But-- wait, no, they could have done all of that easily.

    Okay, well, at least the heryky-jerky movement is consistent with the behavior of standard UI elements, and... no, I'm wrong on that one too.

    Umm-- at least the ATK dropdown list supports enhanced keyboard interaction and... [url="http://forums.thedailywtf.com/forums/p/28537/335870.aspx#335870"]fuck.[/url]

     



  • @ender said:

    I'm well aware of this - why do you think I mentioned it? :)
     

    Your wording was a bit ambiguous.  "Try selecting something with keyboard (not much of a problem in a list with 3 items, but when you have 50...)" Even I thought you meant: "Oh yeah? Well just try using a standard DDL element with a keyboard. Maybe that old shit works fine with 3 items, but have you tried 50? Fuck no. THAT'S why MS created this control, to solve just that problem!"

     



  • @Lorne Kates said:

    I just tried again, and it turns out it's the zoom level.

    Ahhh...yes, I see it now, though for me, it didn't seem as bad as you said (but then, I'm not sure how much of a TDWTF hyperbole discount should be applied). In chrome, it was most noticeable at 150% and then went away at 200%.



  • @Lorne Kates said:

    as always I can't tell because Firefox devs are retarded and don't provide any indication as to what the current zoom level is

    NoSquint is your friend.



  • @Lorne Kates said:

    Nope, specifically disabled all that to test. I just tried again, and it turns out it's the zoom level. Viewing on a 1080p monitor, so I zoomed in so I could actually read the text. Zoom I THINK is 150%, but as always I can't tell because Firefox devs are retarded and don't provide any indication as to what the current zoom level is. (Seriously, View -> Zoom, and all you see is zoom+ and zoom-, not 100%, 120%, 130% with a dot next to it).

    Psst, Lorne!


  • Discourse touched me in a no-no place

    @Ben L. said:

    Psst, Lorne!!
    That looks more like Chrome than Firefox.



  • @Ben L. said:

    Psst, Lorne!
     

    While I appreciate the Imgur link....

     @Lorne Kates said:

    Firefox

     


Log in to reply
 

Looks like your connection to What the Daily WTF? was lost, please wait while we try to reconnect.