CODEWITHSUNDEEP
jqueryhtmlcss
Ankur Verma
Ankur Verma

Reputation: 5933

fixed button in html

I want a button to be fixed in its position, but the fact is I don't know the position of button, I mean I created a page where I placed a button (i.e I didn't fixed its height or width), what I want where ever in the page that button is created, on scrolling its position remains the fixed.

<table width='100%' border='1'>
   <tr><td><input type='submit' value='LogOut'></td></tr>
</table>

Now I don't know where this submit button will be displayed but I want that it should be in place where it is created.

Now I am using this code for making three buttons as fixed, but their left property is auto making them to overlap each other.

$('#headerHome,#headerAccount,#btnSignOut').button().each(function(){
    alert(''+$(this).css('left'));
  //$(this).css({
  //  'position' : 'fixed',
  //  'top': "'"+ $(this).css('top') +"'",
  //  'left': "'"+ ($(this).css('left')-100) +"'",
  //  'z-index' : '100'
  //});
});

Please shed some light.Thanks in advance.

PS. I am using JQuery

Upvotes: 0

Views: 1429

Answers (2)

davids
davids

Reputation: 6371

Try this:

$(document).ready(function(){
    $('#yourButtonId').css({
        position: 'fixed',
        top: $('#yourButtonId').position().top,
        left: $('#yourButtonId').position().left
    });
});

Upvotes: 1

Philemon philip Kunjumon
Philemon philip Kunjumon

Reputation: 1422

just add the css below... no need to go for jquery to place the div on a fixed position on a page.

table input[type=submit]
{
position:fixed;
top:150px;
}

hope this helps

Upvotes: 3

Related Questions