How can I create a Toggle Button which jumps to the recently

Topic: How can I create a Toggle Button which jumps to the recently opened div?

salman1793 pro asked 6 years ago

Hi,

Thank you for reading this. I am trying to create an anchor tag which acts as a toggle button. The functionality is to jump to the recently opened div, after the user clicked on the toggle button.

I am not able to comprehend the documentation (https://mdbootstrap.com/angular/advanced/collapse/) which says:
Accessibility
Be sure to add aria-expanded to the control ....
I believe the answer is hidden in the above-mentioned paragraph. I request you to please guide me in the right direction.

Looking forward to hearing from you.

Regards,

Salman Mujtaba

salman1793 pro commented 6 years ago

I have another question regarding the toggle button. The media queries do not seem to work when I try and display a complex section below the toggle button. Basically, I have a carousel of cards. The cards have toggle buttons. The section (details) to be toggled id to be displayed below the carousel. Below the Carousel is a Contact section. Currently, the details section is overlapping with the contacts section. It works fine if I simply display the details section (no toggle button). Example: ... Carousel cards But this acts crooked: ... Carousel cards The problem is, when I simply append the

Please insert min. 15 characters.

Dawid Adach pro commented 6 years ago

Could you please attach some code?

Add comment

salman1793 pro answered 6 years ago

0 0 Best answer

Hi Dawid,

Thank you for your reply. I found out that the carousel display just displays the first card of every set of cards. In that case, I might not need the toggle button at all.

This brings up another question though, can the carousel show all the cards on a smaller device?

I have, yet another question. I am using the parallax intro, and I have an author box below it. Without the full-height class in html, the author box lines up perfectly beneath the intro. But, with class="full-height" the author box, in smaller devices, overlaps with the intro. There is something which needs to be changed in the media queries I guess. I don't know what though, 'cause the sample code of parallax intro website works fine on a mobile.

Another problem that I am facing related to the above scenario is that my intro page's background image is not working on iPhone (Safari, Chrome) for some reason. It might be a problem in Safari idk. But, when I view it on an Android device, it looks good enough. Please have a look: <a class="ng-binding" rel="nofollow">http://salmanmujtaba.s3-website-us-east-1.amazonaws.com</a>

Please share your email so that I can share the code with you. Thanks.

Please insert min. 20 characters.

Hi Dawid, Thank you for your reply. I found out that the carousel display just displays the first card of every set of cards. In that case, I might not need the toggle button at all. This brings up another question though, can the carousel show all the cards on a smaller device? I have, yet another question. I am using the parallax intro, and I have an author box below it. Without the full-height class in html, the author box lines up perfectly beneath the intro. But, with class="full-height" the author box, in smaller devices, overlaps with the intro. There is something which needs to be changed in the media queries I guess. I don't know what though, 'cause the sample code of parallax intro website works fine on a mobile. Another problem that I am facing related to the above scenario is that my intro page's background image is not working on iPhone (Safari, Chrome) for some reason. It might be a problem in Safari idk. But, when I view it on an Android device, it looks good enough. Please have a look: http://salmanmujtaba.s3-website-us-east-1.amazonaws.com Please share your email so that I can share the code with you. Thanks.

Dawid Adach pro commented 6 years ago

Dear salman1793, curently multi item carousel is showin only first slide , there is an idea to customize this behaviour however now this is expected otuput. Regarding second quesion - could you please attach some code sample? My email is d.adach@mdbootstrap.com

salman1793 pro commented 6 years ago

I would appreciate it if you could please reply here. Thank you.

Dawid Adach pro commented 6 years ago

Dear salman, could you please share your code as I requested before? Dawid

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Pro
Premium support: No
Technology: MDB Angular
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: Yes
Provided link: No

salman1793

Pro User 77Support score
9Questions 7Answers 0Snippets