3dbounce
Posts: 0
Joined: Sat May 18, 2013 9:58 am

Center Grid to the center of the screen

Hi,

Im wondering if anyone knows how to center a grid which contains images to the center of the screen?

I have tried:

Tiggzi('mobilegrid').css('margin', 'auto');
Tiggzi('mobilegrid').css('display', 'block');

and

var cellElement = Tiggzi('mobilegrid').closest('td')
cellElement.css('text-align', 'center').css('vertical-align', 'middle');

but these only center it horizontally and not vertically.

Anyone got any ideas how to solve this problem?

here is a screen shot:
Image

Alena Prykhodko
Posts: 0
Joined: Tue Apr 09, 2013 7:36 am

Center Grid to the center of the screen

Hello!

It seems to be the problem with vertical-align.
Look here please https://www.google.com.ua/#q=vertical....
https://www.google.com.ua/#q=vertical....

3dbounce
Posts: 0
Joined: Sat May 18, 2013 9:58 am

Center Grid to the center of the screen

can you explain to me how i could implement this:

http://stackoverflow.com/questions/21...

I have tried adding this as a load function:
$('mobilegrid').css({top:'50%',left:'50%',margin:'-'+($('mobilegrid').height() / 2)+'px 0 0 -'+($('mobilegrid').width() / 2)+'px'});

but it dosnt work.

I have tried:
(function($){
$.fn.extend({
center: function () {
return this.each(function() {
var top = ($(window).height() - $(this).outerHeight()) / 2;
var left = ($(window).width() - $(this).outerWidth()) / 2;
$(this).css({position:'absolute', margin:0, top: (top 0 ? top : 0)+'px', left: (left 0 ? left : 0)+'px'});
});
}
});
})(jQuery);

$('mobilegrid').center();

But this does not work either... Any ideas???

3dbounce
Posts: 0
Joined: Sat May 18, 2013 9:58 am

Center Grid to the center of the screen

Hey i just found this too but cant get it to work:
https://github.com/dreamerslab/jquery...

I've uploaded jquery.center.js to my Javascript folder and inserted this into the load event:
// centralize .some-element against its parent element
$( 'mobilegrid' ).center({
against : 'mobilecontainer',
top : 10
});

Alena Prykhodko
Posts: 0
Joined: Tue Apr 09, 2013 7:36 am

Center Grid to the center of the screen

Working on it now, I'll update. It may need some time.

3dbounce
Posts: 0
Joined: Sat May 18, 2013 9:58 am

Center Grid to the center of the screen

Thanks a lot Alena!

Igor
Posts: 0
Joined: Tue Apr 02, 2013 12:05 pm

Center Grid to the center of the screen

Please add js on "Home1" page "Load" event .
code
$('[dsid="mobilegrid"]').flexVerticalCenter();
/code

3dbounce
Posts: 0
Joined: Sat May 18, 2013 9:58 am

Center Grid to the center of the screen

Hi,

I've tried that and it doesn't work either :(

Igor
Posts: 0
Joined: Tue Apr 02, 2013 12:05 pm

Center Grid to the center of the screen

HI,

One more changes in the "fileflexverticalcenter.js" file

from
code
$this.css(attribute, ( ( $this.parent().height() - $this.height() ) / 2 ));
/code
to
code
$this.css(attribute, ( ( $this.parent().height()) / 2 ) );
/code

3dbounce
Posts: 0
Joined: Sat May 18, 2013 9:58 am

Center Grid to the center of the screen

hmm Dosent work when i preview on phone and its a little glitchy in your viewer. Please see my other post:
https://getsatisfaction.com/apperyio/...

If you can help to solve this then we wont have to worry about it centering.

Return to “Issues”