CODEWITHSUNDEEP
htmlcsshtml-tableanchor
Matthew
Matthew

Reputation: 865

Load html table at specific column

I'm trying to on page load get my html table to load at a specific column, I wouldn't even know where to start with this.

I've uploaded it here to see a demo: http://jsfiddle.net/3EFqD/

I've tried this in my body tag: 

onload=' location.href="#right_column" '

and added id='right_column' to the correct td but that didn't work

Trying to get it to load on the cell that is labeled "this one"

Upvotes: 2

Views: 226

Answers (3)

Karthik Naidu
Karthik Naidu

Reputation: 141

May be if you are trying to load some html code(like table) in the mentioned td(This one), as you mentioned add id=right_column to this td and then use the below jquery logic -

var newtable = '<table class="newtable">New table, this may be from ajax call also</table>'
$('#right_column').html(newtable);

Upvotes: 0

Ted
Ted

Reputation: 14927

Here's a fiddle incorporating the width of the header: Fiddle Again, a jquery solution, essentially the same as above but needs to subtract the header width to hit the right position. See the fiddle for where the id's are added

 $(document).ready(function(){
    var hw = $('#headerWidth').width();
    var f = $('#scrollToMe').position().left - hw;
    $('.inner').scrollLeft(f);
})

Upvotes: 1

SW4
SW4

Reputation: 71190

If Im right in thinking you want a specific column to be scrolled to on page load, the easiest way would be to use a library, e.g. jQuery:

$('.inner').stop().animate({
    scrollLeft: $('#right_column').offset().left
}, 1000);

Demo Fiddle

You're trying to make it work in a similar way to using anchors- however this isnt possible for horizontally aligned content.

Upvotes: 0

Related Questions