Tagged: html, mobile devices
-
AuthorPosts
-
September 6, 2016 at 5:14 pm #682742
Hello,
unfortunately the page-anchors are not working correctly on mobile devices. That is, the anchor does not jump to the correct position. I don’t have any explanation for this as it should be pretty straightforward. I attached the respective URLs below. It would be great if you could help me to solve this problem. Many thanks.September 6, 2016 at 5:22 pm #682747Hi Chris2234!
Can you please try adding your anchor links as following
#immobilien
Currently you are using full linksBest regards,
YigitSeptember 6, 2016 at 6:56 pm #682784Thanks for the quick reply. I just tried your suggestion. Unfortunately, changing the link to a relative path doesn’t make any difference.
September 6, 2016 at 7:09 pm #682795Hi!
Do you mind creating a temporary admin login and posting it here privately so we can look into it?
Cheers!
YigitSeptember 6, 2016 at 7:11 pm #682799Sure, thanks for your support!
September 8, 2016 at 11:18 am #683619Hello, any results so far?
September 9, 2016 at 1:33 pm #684165Hey!
Sorry for the late reply!
I have adjusted the links as i suggested above and confirmed that they are working fine on my iphone. Can you please review your website now?
Cheers!
YigitSeptember 9, 2016 at 3:44 pm #684218Many thanks for your efforts!
Unfortunately the links are still not directing to the correct positions on the page. Moreover, since you adapted the links the whole navigation is not working anymore on subpages due to the relative nature of the paths.September 12, 2016 at 4:25 am #684862Hey!
Why did you hide the first section?
#av_section_1 { display: none!important; }
Please add this in the functions.php file:
// custom script add_action( 'wp_footer', 'ava_custom_script' ); function ava_custom_script() { ?> <script type="text/javascript"> (function($) { function b() { $('.home #av_section_1').remove(); } $(window).load(function() { b(); }); })(jQuery); </script> <?php }
Cheers!
IsmaelSeptember 12, 2016 at 12:45 pm #685035Thanks Ismael, I tried your javascript and I later removed the hidden section (it contained a custom-code-block). However, the anchors still don’t work properly. Again, thanks for your support.
September 17, 2016 at 1:15 am #687771Hi,
I checked the site navigation (including subpages) on a android mobile and the anchor links looks good on my end. You may not see the changes until the cached files are cleared in your browser.
Please try to hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload” and review the site again.
Or you could also check it on a different mobile phone from which the site was not accessed earlier. This will ensure that the browser cache is not an issue here (If any caching plugin is active you need to disable it to view changes as well).
Best regards,
Vinay- This reply was modified 8 years, 2 months ago by Vinay.
September 30, 2016 at 10:52 am #693600Thanks Vinay! Unfortunately the problem is still not solved. Even if you minimize the browser window to the size of a mobile device the page anchor positioning does’t work…
October 1, 2016 at 1:07 pm #694207The fact that the page anchors do not work properly is a serious problem for my customers because this significantly compromises the usability of the website. On mobile devices the links direct visitors to the wrong position on the page. I just tested the unmodified (demo and it also suffers from the same problem. if you minimize the browser window and use the hamburger-menue in order to navigate to, i.e., “Service” you are redirected to “Previous Employers”… (see attached screenshot). It would be great if someone could help me to solve this problem asap. Many thanks for your support in this matter!
October 1, 2016 at 1:10 pm #694208In the previous post I meant the link “About” instead of “Service”
October 4, 2016 at 4:34 am #694847Hi,
I didn’t notice this before but the site is using a very old version of the theme, 3.5.4. Please update the theme to version 3.8 and WordPress to 4.6.1.
Best regards,
IsmaelOctober 4, 2016 at 8:37 am #694921are you sure this will solve the problem? does the krisis demo (on which the theme is based) run on the latest version. if yes, one can deduce that the problem is independent of the version. many thanks for your support!
October 5, 2016 at 6:04 am #695295Hi,
The demo is running the latest version yes, so if it’s not happening there updating should work.
Thanks,
RikardOctober 5, 2016 at 11:36 pm #695808Hi Rikard,
Many thanks for your reply. Given that the demo runs the latest versions and still suffers from the “imprecise anchor problem” one can infer that updating won’t make a difference.
It is really strange – html page anchors are usually pretty straightforward. However, for some reason they don’t work in this theme… It would be great if someone could serve this is you because I don’t know any solution period many thanks in advance.October 8, 2016 at 9:51 am #696872Hi!
Given that the demo runs the latest versions and still suffers from the “imprecise anchor problem” one can infer that updating won’t make a difference.
Which demo? Please upgrade to the latest version of the theme and WordPress. We will continue with the issue once you have the latest versions running in the system.
Cheers!
IsmaelOctober 8, 2016 at 7:09 pm #696925Hi Ismael,
I referred to the original enfold demo which suffers from the same problem even though it runs the latest version. Consequently, updating won’t solve the issue.
URL: http://kriesi.at/themes/enfold-consulting/
(minimize the browser-window and test the anchor-links in the hamburger menue (i.e., the “About” link) and you will see that the page jumps to the wrong position)…
Many thanks for your support!October 9, 2016 at 1:50 am #696949Hi,
Thank you for bringing this up. We have forwarded this to our devs. I believe the issue is mostly related to duplicate ID’s.
If you copied the demo page the issue is likely going to get replicated please try to re-create the page and it should work fine.The credentials you provided earlier do not work. Please provide working credentials and we can help you setup the page correctly.
Best regards,
Vinay- This reply was modified 8 years, 1 month ago by Vinay.
October 9, 2016 at 4:23 am #696963Hi Vinay,
thanks for the quick reply. Here are the credentials.
Best wishes,
ChrisOctober 9, 2016 at 7:22 am #696983Hi,
I checked your site and you are using an old version of the theme. Please update the theme tot he latest version 3.8
The theme update options are not available because wordpress transient is not cleared. Please try this plugin to clear WordPress transients if you do not receive auto updates and make sure your API key is correct: https://wordpress.org/plugins/artiss-transient-cleaner/.
If it does not help, I am afraid you might need to update the theme manually – http://kriesi.at/documentation/enfold/updating-your-theme-files/
Unfortunately not all Server environments are able to make use of the auto update feature provided by ThemeForest :/
Best regards,
VinayOctober 9, 2016 at 11:26 am #697042Hi Vinay, then problem won’t be solved by updating the theme. Rikard pointed out that the official enfold demo (http://kriesi.at/themes/enfold-consulting/) runs the latest version and it suffers from the same problem. See https://kriesi.at/support/topic/page-anchors-on-mobile-devices/#post-695295
October 9, 2016 at 11:33 am #697044Hi,
We want to be on the same page here.
If you are going to use an old version of the theme, we will have the latest version which is a different copy from what you have so the solution that we provide you might not work.
We strongly recommend you to update the theme to the latest version that way we both will have the same copy of the theme and it will be easier to troubleshoot this further. Not only that but the latest version of the theme has a lot of new features as well which you can benefit from.Please backup your site and go ahead and install the latest version of the theme.
Best regards,
VinayOctober 9, 2016 at 1:07 pm #697051Hi Vinay,
as requested, I just updated WP and the theme itself. However, the page-anchors are still not working correctly on small screens.
Many thanks for your support,
Best wishes,
ChrisOctober 10, 2016 at 6:26 am #697158Hi,
Thank you for the kind cooperation. There seem to be a glitch in this demo. We will work on it and release a fix in one of our next update.
In the meantime we will try to provide you a temporary solution but this might take a little time.Thank you for using enfold.
Best regards,
VinayOctober 10, 2016 at 5:21 pm #697483Hi Vinay,
I hope that someone can solve this problem asap.
Many thanks,
ChrisOctober 12, 2016 at 11:17 am #698195Hi,
We have added the below code at the very end of your themes / child themes functions.php file:
// Scroll to div function scrollToDiv(){ ?> <script> jQuery(document).scroll(function() { var sections = jQuery('.avia-section'), menu = jQuery('#mobile-advanced a[href^="#"]'); menu.on('click', function(event) { var target = jQuery(this.getAttribute('href')); if( target.length ) { event.preventDefault(); jQuery('html, body').stop().animate({ scrollTop: target.offset().top - 1000 }, 1000); } }); }); </script> <?php } add_action('wp_head', 'scrollToDiv');
Best regards,
Vinay- This reply was modified 8 years, 1 month ago by Vinay.
October 13, 2016 at 11:58 am #698669Hi Vinay,
nice one – your solution is great! However, you also changed the absolute paths in the menue to relative paths. This causes some problems because now visitors can’t use the menue in order to navigate from subpages back to the mainpage (see example below). If I adapt the path and make them abolute again your solution does no longer work. Is it possible to adapt the code you provided?
Many thanks,
Chris
-
AuthorPosts
- The topic ‘page anchors on mobile devices’ is closed to new replies.