-
Search Results
-
Hi, this seems to be more of an issue with Chrome, since it’s being displayed perfectly on firefox and IE. But what happens is on chrome, the width of the columns is not even, this leads to some of my buttons looking different to the others (eg. Some of the buttons shows up as two rows of text while some are just one row of text). I’ve tried making the table ‘scrollable’ or ‘automatically fit screen’ but it still shows up unevenly on chrome. Any ideas is appreciated.
Hi guys,
I’d like to display the logo (in my case the subtext) when the responsive menu is open. Please see screenshot:
I tried using a z-index but maybe I’m stupid. Also, I’ve noticed that when the menu toggle is clicked on, the page will be automatically scrolled to top. How can I prevent this?
In reply to: Enfold Photography demo – front page won't scroll
Hi Ismael,
Thanks for that. It looks fine in Safari and FF on the Mac where the scroll bar fades out when not in use, but very clunky in Windows IE.
Inspired by your example I modified my code to:
#wrap_all {
overflow: auto;
}Which seems to be the best compromise all round.
In reply to: Enfold Photography demo – front page won't scroll
Hey!
You can add a scroll bar on the sidebar menu but it won’t look that good:
.html_header_left #top #header { overflow: auto; }Or decrease the menu padding and font size. The left sidebar header works well when content is taller than the side header.
Regards,
IsmaelIn reply to: Padding issue w/ logo and Heading
The min-height is only there to fix most of the pages. Any page that has shorter content doesn’t need that 3000px and then makes the page scroll when it doesn’t need to be. Is there a better way to make the column/sidebar automatically take on whatever height the content container is?
In reply to: Organizing Portfolio items
i have set up the portfolio on my home screen, it has the option if i want pagination or not. Is there a way i could make it scroll automatically without clicking on the pagination pages to display next set of items?
Hi,
I mean what a told at first message: “How can I define “the point of page scroll” where I want the video background in a color section to autoplay?”
I don´t want the viewer to press “play”, just the video start at a certain point of the scroll when it is already at the viewport.
I have managed to do this with javascript an waypoints, so it is solved.
Thanks.
OSCAR
Hi!
How exactly are you using your video? A link to your website would be useful. As fullwidth slider? If yes click to edit the fullwidth slider->click on the video to edit it->scroll down to “disable Autoplay”
Or a normal video inside of a color section?Best regards,
AndyTopic: Add music to the front page
Hello,
I need to have music playing in the background on the front page where the full screen slider is.
Woudl you be able to mpoint me in the right direction as to achieve the following:
1. add background music
2. add background music with the player (play/stop button) visible
3. add background music that will stop automatically once the page is scrolled downkind regards,
PeterIn reply to: Sticky Masonry Menu
Hi!
You can try this:
.header-scrolled + div div div .av-masonry-sort.main_color.av-sort-yes { margin: 0; position: fixed; top: 90px; z-index: 900; margin: 0 auto; max-width: 1500px; padding: 20px 50px; width: 1364px; }Regards,
IsmaelThanks Ismael.
I understand what you say. Just one questions: Talking about enfold settings, How do I disable autoplay in color section video background?
I would be able to develop a script to triger the video depending on the scroll.
Thanks.
OSCAR
Hi,
How can I define “the point of page scroll” where I want the video background in a color section to autoplay?
That is, I want the video not playing until the scroll/video reaches a certain point (and then autoplay).
Thanks very much,
OSCAR
The logo and main menu navigation, has too much white space, We need to use a logo which is slim, (44px in height or max 60px).
BUT we need the white space below the logo right above the navigation to go away.
I need code for this.(also keep in mind when I do this too, the Learn more scrolling wont match, at all please read the post above for details)
I repeat the same question: Nothing you have given me is helping:
I had clearly mentioned the steps above to follow, and create the error, but you dont seem to be helpfulNone of the CSS code below has helped from you:
==============
Elliott wrote:Hi consult!
It looks like the problem is this code in your Quick CSS field.
.responsive #top #header .logo {
height: 90px !important;
margin: 0 auto;
padding-bottom: 0;
padding-top: 0;
}Remove the !important rule. Or just reduce the height there.
Best regards,
Elliott
===========
Elliott wrote:Hi!
Add this to your custom CSS.
#header #header_main_alternate .container {
padding: 0px !important;
}Cheers!
Elliott
================Not working any of the above… please provide support or stop selling such Themes…which dont work, and there are 100000 issue in support forum,. which clearly proves that your theme has a lot of capability but at the same time its not working for everyone..somehow there are defects.
In reply to: White space below logo
Follow these steps for error creation:
Or send me the correct CSS code:Create a dummy site, or on your version, please allow the logo and menu activated on mobile:
.responsive #top #header {
position: fixed !important;}
Now that you see a logo and social bar on the mobile potrait and landscape both.
Step 2
=======
Create a page which has a 1st section as parallax, with a learn more scroll button, which goes to anchor below on next color sections.=====
Step 3Click on the learn more from mobile version.
======
Step 4,
you will see… perfect alignment of the section.Step 5.
======
Here I want to reduce the logo height and white area, as its taking too much space specially on landscape, you dont have much left to read the website.
So reduce the logo area..
.responsive #top #header .logo
{
padding-top:0px;
margin:0px auto 0px;
padding-bottom:0px;
margin-bottom:0px;
height: 30px!important;
}
.responsive #top #main {
padding-top: 60px !important;
padding-bottom:0px !important;
margin-bottom:0px !important;
}now the logo looks nice, but try scrolling using the learn more / go to the below anchor…
the below section does not alignIn reply to: WordPress 4.0 and Enfold
Hi!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
div#mc_embed_signup_scroll .clear { visibility: visible!important; width: auto!important; height: auto!important; }Cheers!
YigitIn reply to: WordPress 4.0 and Enfold
When i click on the link “Leistungen” and click on the portfolio “Badebottich” i get this:
I want/need the following: when a user scrolls down to the end of the portfolio “Badebottich” the next portfolio should be appended, like seen in the following “collage”. And then the next portfolio, and the next portfolio (appended automatically when someone scrolls down) – is there a possibility to get this result?
Hello!
I wonder if it is possible to make the load more button on masonry (not masonry gallery) load less posts if you are on a mobile device?I’m also wondering if it is possible to make the load more thing happen automaticlly when you scroll down? Like infinite scroll.
Thanks in advance!
In reply to: Problem on mobile device with fullscreen slider
Hi Simon
If it is the same issue I am having where I have a background image which has most of the imagery at the bottom and captions are centered. Firstly I re-positioned the background to bottom align in quick css. I did it using the function in the slider options but it did not work for some reason. I also changed the sizing to full height rather than full width ( I made images to suit this so you may not need to).
.avia-fullscreen-slider .avia-slideshow > ul > li { background-position: center bottom !important; background-size: auto 100% !important; }Then for mobile devices I had to tweak it a bit because the header is now visible rather than hidden until scrolled. So I added this too:
@media only screen and (max-width:640px) { .avia-fullscreen-slider { top:-100px;margin-bottom:-100px;} } @media only screen and (max-width:360px) { .avia-fullscreen-slider { top:-140px;margin-bottom:-140px; } }The first media query is for mobile landscape which I only bumped up a bit to suit.
The second I pushed a bit more as it is for the portrait version and needed it.
I also made sure the next section was pulled up to meet it because if not there would be a gap created by the ‘negative lift’.Well hope this helps as a guide.
Jay
Topic: Mobile Menu Search Function
Hello,
I have customized the mobile Menu of enfold to show the header area. Result is live here:
cop-morrien.deDue to client request I added a search icon to the mobile-header. The search Icon links to the search-field
in the sidebar (under the main-content in mobile view). Everything works fine so far. The only thing, that I can not manage to get to work is the following case:
When the menu is open and the user clicks the search icon in the header (next to the mobile menu toggle icon) I want the menu to hide and the page to scroll to the search field. The scroll does work, but I can not get the menu to hide at the same time.This is my code in js > avia.js (which I have copied to my child theme):
$html.on('click', '#add-search-icon', function() { container.removeClass('show_mobile_menu'); container.css({'height':"auto"}); });But this sadly doesn’t work. I also tried:
$(#add-search-icon).click(hide_menu);Can you please check what is wrong.
Thanks
In reply to: Menu is overlapping the logo
Hey!
Try with this code instead:
@media only screen and (min-width: 767px) { .logo a img { width: 350px; height: auto; } .logo a img{ top: 22px; } .header-scrolled .logo a img{ top:0; } } @media only screen and (max-width: 1024px) { .html_mobile_menu_tablet .main_menu , .html_mobile_menu_tablet #header_main_alternate{display:none;} .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide{display:block;} .html_mobile_menu_tablet #mobile-advanced{display:block;} }Best regards,
JosueIn reply to: MapifyPro question
Hi, I was just browsing the Forum. I asked about the width of the tooltip and the guys gave me this so I could make them larger and loose the scrollbar:
<div style=”overflow: auto; width: 175px; height: 175px;”>
Enter the text here that you wish to show in the tooltip</div>My tooltips also have a heading in bold which link to another page on the site so mine now look like this:
<div style="overflow: auto; width: 175px; height: 175px;"><a href="/services/pagename/"><strong>pagetitle</strong></a> Enter the text here that you wish to show in the tooltip</div>I also use the latest version of Enfold which has a fullwidth google map element and works great.
Hope this helps.
HIn reply to: v3.0 – Tables NO longer responsive on iPad
Hey George!
Try adding this code to the Quick CSS:
@media only screen and (max-width: 989px) { .responsive div .avia_responsive_table .avia-data-table table, .responsive div .avia_responsive_table .avia-data-table tbody, .responsive div .avia_responsive_table .avia-data-table tr, .responsive div .avia_responsive_table .avia-data-table td, .responsive div .avia_responsive_table .avia-data-table th{display:block; border-top:none; border-right:none; border-left:none; text-align: center;} .responsive .avia_responsive_table .avia-data-table{border-style:solid; border-width: 1px;} .responsive .avia_responsive_table .avia-data-table .avia-pricing-row .avia-desc-col{text-align: center;} .responsive .avia_responsive_table .avia-data-table .avia-button-row, .responsive .avia_responsive_table .avia-data-table tr:first-child th{display:none;} .responsive .avia_responsive_table .avia-data-table td:before { display:block; font-style: italic; font-size: 11px; } .responsive .avia_responsive_table .avia-data-table td { position: relative; } .responsive .avia_scrollable_table { width: 100%; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } .responsive .avia_scrollable_table .avia-data-table > thead > tr > th, .responsive .avia_scrollable_table .avia-data-table > tbody > tr > th, .responsive .avia_scrollable_table .avia-data-table > tfoot > tr > th, .responsive .avia_scrollable_table .avia-data-table > thead > tr > td, .responsive .avia_scrollable_table .avia-data-table > tbody > tr > td, .responsive .avia_scrollable_table .avia-data-table > tfoot > tr > td { white-space: nowrap; } }Cheers!
JosueIn reply to: Different Header layout for custom template
Topic: Separated layer elements
RE: http://screencast.com/t/0CFhDbWeF4
Any obvious reason why the backgrounds for screen capture above would act as independent blocks?
The content of the layer is http://screencast.com/t/hEzHpz9pp.
<h2 class="sliderhead sliderbox" style="box-shadow: 0px 4px 10px -5px black; text-shadow: none; font-weight: normal; opacity: 0.75; text-align: right; padding: 25px 30px 25px 40px; font-family: inherit; font-size: 16px; line-height: 18px; color: rgb(255, 255, 255); background: none repeat scroll 0% 0% rgb(56, 48, 48); width: auto; height: auto; border-width: 0px;">Label Design</h2> <p class="sliderbox" style="box-shadow: 0px 4px 10px -5px black; text-shadow: none; font-weight: normal; opacity: 0.75; text-align: right; padding: 25px 30px 25px 40px; font-family: inherit; font-size: 16px; line-height: 18px; color: rgb(255, 255, 255); background: none repeat scroll 0% 0% rgb(56, 48, 48); width: auto; height: auto; border-width: 0px;">Packaging, labels and POS displays that give your product the attention it deserves.</p>In reply to: Auto Scrolling to IFrame Location on Mobile Device
Hey!
I checked the site on mobile and desktop but it doesn’t autoscroll on the iframe section. Have you tried linking the iframe to another html site without the added scripts? I’m sorry but we don’t provide support for third party scripts. Maybe there’s a conflict between the theme and the external document which will be difficult to trace. Please hire a freelance developer to investigate the external document closely.
Cheers!
IsmaelHi!
After updating the theme I’m having problems with Avia Layout Builder. When I drag&drop an element the whole page stop working. I can’t scroll up or down, causing me to not reach the save/update button. I have to reload the page, and if I’m lucky, WordPress have auto-saved the page for me.
I did not experience this issue on the previous theme version. I am using Safari on Mac, and I have tried another computer. It works fine in Chrome.
Can you help?
