This week's book giveaway is in the Design forum.
We're giving away four copies of Design for the Mind and have Victor S. Yocco on-line!
See this thread for details.
Win a copy of Design for the Mind this week in the Design forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

place div element in lower left corner of browser using jQuery

 
Michael Brown
Greenhorn
Posts: 27
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hello!

Can somebody help me with this problem:

I started learning jQuery, and cannot figure out how to position some div in lower left corner of my browser...?


This div's ID is , for example "myDiv", and is not visible.

I want to position it, and then show it using .show() function

Thanks!
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64700
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
No need to use jQuery. Positioning can be accomplished via CSS. Check out the fixed value of the position property. (Note: not all browsers yet support this).

The only time you'd need jQuery assist is if you want to dynamically position the element in browsers that do not support fixed.

Or are you trying to move it into this position as part of an animation?
 
Michael Brown
Greenhorn
Posts: 27
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:

Or are you trying to move it into this position as part of an animation?


Yes, this is exactly what I would like to do...

One option is to create this div when page loads ( and set it's display: none) and position it later it in the lower left corner and show it...

Or to create it dynamically and then position it it in the lower left corner and show it...

 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64700
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
That's contradictory.

Do you want it animated or not? Animation will involve script (jQuery), while non-animated can be done with simple CSS.

For animation, you can use jQuery to compute the final position of the element, and use the .animate() method. Otherwise, you can just position it with CSS.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic