SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Wizard
    Join Date
    Aug 2002
    Location
    N.Ireland
    Posts
    1,046
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    print css and js

    I have a menu on my page which is placed using absolute positioning via a linked .js file. The menu has a variable which allows me to give it an ID so the div is placed on the page exactly where I want it on the page.
    My problem is I don't want to display this menu when the page is printed. If I use display: none; on this div it has no effect as all it is there to do is specify a position not rendering. So is there a way to disable an external .js file via css for print?

  2. #2
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    SvÝ■jˇ­
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)


    No, not disable the js via css, but you could add this to your style sheet:
    Code:
    @media print
    {
      #id_for_your_div
      {
        display: none;
      }
    }

  3. #3
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Or create a totally different stylesheet for print and format that however you want. I do that on my site and it works pretty nicely; no menus displayed makes it easier to read and gives the content more room on the page .

  4. #4
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    SvÝ■jˇ­
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by vgarcia
    Or create a totally different stylesheet for print and format that however you want. ...
    Is that really a good idea?
    Doesn't, for example, IE 5.5 have some problem understanding media=screen, media=print etc? The result is (in IE 5.5) that your page (the screen version) get the print style (menus invisible! ). If you use code like the "@media print" example above, inside your main css file, the screen version looks OK in IE 5.5 too.
    I don't know if my description of the problem is correct (or if it's comprehendible at all...), just know that two separate css files didn't work for IE 5.5, while one single css file, and "@media print", did work.


    (And thank you, redux, for the "print css inside general css" idea! )

  5. #5
    SitePoint Wizard
    Join Date
    Aug 2002
    Location
    N.Ireland
    Posts
    1,046
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmm, I knew I'd have problems explaining this one!

    I get what you're saying guys but if I remove that div altogether the menu is still displayed cause by default the js writes it to the top left of the screen, all the div does is position it using an id which a variable in the js itself creates.

    I really need a solution which says, ok, this person wants to print the page, ignore the javascript completely!

  6. #6
    Sultan of Ping jofa's Avatar
    Join Date
    Mar 2002
    Location
    SvÝ■jˇ­
    Posts
    4,080
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ...or find the ID created by the javascript?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •