Databases
StackOverflow2013
Postsdbo
POHow to keep jQuery function from moving elements all the way to the left?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to keep jQuery function from moving elements all the way to the left?
    primarykey
    data
    text
    <p>I was able to implement the solution posted <a href="https://stackoverflow.com/a/5317900/1256700">here</a> ("position: fixed and absolute at the same time. HOW?") to get a div element to move with the rest of the page horizontally, but stay fixed vertically. However, this solution causes the selected element to move ALL the way to the left of the page (with what appears to be a 20px margin). I'm still new to javascript and jQuery, but as I understand it, the following:</p> <pre><code>$(window).scroll(function(){ var $this = $(this); $('#homeheader').css('left', 20 - $this.scrollLeft());}); </code></pre> <p>takes the selected element and, upon scrolling by the user, affects the CSS of the element so that its position from the left becomes some function of the current scrollbar position adjusted by the 20px margin. If this is correct? And if so, can anyone think of a way that I could change it so that instead of moving the selected element all the way to the left side of the window, we only move it as far left as my default CSS position for the body elements of the HTML document (shown below)?</p> <pre><code>body {font-size:100%; width: 800px; margin-top: 0px; margin-bottom: 20px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px;} </code></pre> <p>EDIT: Here is a <a href="http://jsfiddle.net/6nxBg/2/show/" rel="nofollow noreferrer">jsfiddle</a> (code <a href="http://jsfiddle.net/6nxBg/2/" rel="nofollow noreferrer">here</a>) that I made to illustrate the issue. My page is designed so that when it is displayed in full-screen or near full-screen mode, the #homeheader element appears centered horizontally due to its width and the left and right margins being set to auto. As the page gets smaller and smaller the margins do as well, until they disappear altogether and are replaced by the padding-left and padding-right settings of 20px. So at this point (when the window is small enough that the margins disappear altogether), which is what the jsfiddle shows, the code appears to work as intended, but when the window is full-sized the JS overrides the CSS and pushes the div element all the way to the left (getting rid of the margin) upon any scrolling action.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCommunity
    1. USGChorn
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHow to keep jQuery function from moving elements all the way to the left?
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POHow to keep jQuery function from moving elements all the way to the left?
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POHow to keep jQuery function from moving elements all the way to the left?
      1. This table or related slice is empty.
      1. VTUpMod
    1. COWhat css is on `#homeheader`? Hard to say what's going on without an example. a [jsbin](http://jsbin.com) might help :)
      singulars
      1. POHow to keep jQuery function from moving elements all the way to the left?
      1. USChristian Varga
    2. CO@ChristianVarga, I edited my post to include a jsfiddle but as you'll see from the rest of my edit, it doesn't exactly illustrate my problem...
      singulars
      1. POHow to keep jQuery function from moving elements all the way to the left?
      1. USGChorn
    3. CORegarding your jsFiddle, simply add `/show` to the end of the Fiddle URL... [http://jsfiddle.net/6nxBg/show/](http://jsfiddle.net/6nxBg/show/)
      singulars
      1. POHow to keep jQuery function from moving elements all the way to the left?
      1. USSparky
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload