Joe
|
Concerning the way Artisteer handles responsive templates; In mobile view columns appear over the top of the main page content. How can I fix this so the page content is over the column content/modules.
Thanks,
Joe
|
| |
jrgweb
|
@Joe - Try something like this:
<script type="text/javascript">
$(window).resize(function(){
if ($(window).width() <= 480){
$(document).ready(function() {
$('div.art-sidebar1').insertBefore('div.art-sidebar2');
});
}
});
</script>
|
| |
jrgweb
|
@Joe - example
http://www.s299117960.onlinehome.us/demo2/responsive/home.html
|
| |
Joe
|
That's cool.
Where do I put that script?
Thanks,
Joe
|
| |
wp
|
That's pretty cool though you would also need it to adjust the layout back to the correct position when the browser window is scaled out again.
|
| |
jrgweb
|
@wp - I agree! At times it would be nice for the screen to adjust back to the correct position when scaled out. A simple else statement would work nicely.
|
| |
wp
|
I tried this code on a site i'm working on at the moment and for some reason it didn't work. I jot got the following error:
TypeError: 'undefined' is not a function (evaluating '$(window).resize')
global codeabout-us.html:108
content_start_0.js:1:1601
I wish Artisteer would fix this responsive issue as it causes a lot of headaches.
|
| |
jrgweb
|
@wp - If this is for a jommla project you have to use jQuery instead of $
example:
<script type="text/javascript">
jQuery(window).resize(function(){
if (jQuery(window).width() <= 480){
jQuery(document).ready(function() {
jQuery('div.art-sidebar1').insertBefore('div.art-sidebar2');
});
}
});
</script>
If you want one with the else statement to refresh the page to original position, something like this should work:
<script>
jQuery(window).resize(function() {
if (jQuery(window).width() < 480) {
jQuery('.art-sidebar1').insertBefore('.art-content');
}
else {
jQuery('.art-content').insertBefore('.art-sidebar1');
}
});</script>
For desktop, you can move sidebars for a different layout.
As we all know artisteer doesn't allow for sidebar1 and sidebar2 then content. Well you can easily achieve this with small modification of the script.
example: Home menu item is content, sidebar1 and sidebar2.
blog menu item is sidebar1 and sidebar2 then content.
In artisteer 4.2, this is controlled by menu item with the additional HTML feature.
http://demo.artisteertoday.com/move_sidebars/index.html
wp if you still have issues getting this to work contact me at
jrgweb [@] gmail.com and send me a link to website.
|
| |
wp
|
No probs, thanks for the update. I did a bit of fiddling around with it last night and got it to work the way i wanted, so now anything less than the sheet size i have set of 980px will drop the left column below the content, which works great. Hopefully they will implement a fix for this is a realease soon, cheers.
|
| |
Joe
|
Where are you putting these scritps?
Thanks,
Joe
|
| |
Ian Shere
|
To be totally correct, the LEFT HAND column (sidebar) appears before the content. The RH one appears under it. If you don't want stuff before the content use the RH sidebar.
|
| |
jrgweb
|
@Joe - I insert my script in the footer. If you right click and view the source, scroll down to the bottom of the page, you will find the script.
|
| |