Abdul Ahad⚡ Posts - Answer Overflow

Abdul Ahad⚡

Explore posts from servers

KPCKevin Powell - Community WBWeb Bae

Posts Comments

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 5/17/2024 in #front-end

How to update the content in google search results

Hey, how can I add/edit pages, and descriptions here?

2 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 4/29/2024 in #front-end

Filling Input field using js

I'm trying to fill the hidden input field in hubspot form

<input name="last_visited_url_before_demo" class="hs-input" type="hidden" value="">

<input name="last_visited_url_before_demo" class="hs-input" type="hidden" value="">

tried using this code

document.addEventListener('DOMContentLoaded', function() {
    const inputField = document.querySelector('.hs_last_visited_url_before_demo input');
    const url = "theurl.com";
    inputField.value = url;
});

document.addEventListener('DOMContentLoaded', function() {
    const inputField = document.querySelector('.hs_last_visited_url_before_demo input');
    const url = "theurl.com";
    inputField.value = url;
});

Codepen: https://codepen.io/Abdul-Ahad-the-decoder/pen/KKYYyod?editors=1010 i'm not sure, what's going wrong here, can you please help

9 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 4/27/2024 in #front-end

Overflow Issue

https://w5bkz10l-3000.inc1.devtunnels.ms/ I'm trying to find which section is overflowing, tried inpecting all of them, no luck. Can you please help

6 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 3/24/2024 in #front-end

Responsiveness query

5 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 3/5/2024 in #front-end

Google search result name change

2 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 2/12/2024 in #front-end

How to style the selected option of the dropdown

I'm able to style the options but not the selected option. I've read that this style is inherited from the brower defaults. Can you please help me style the selected option. https://codepen.io/Abdul-Ahad-the-decoder/pen/abMRxZP

9 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 10/9/2023 in #front-end

Rotating Tab links in mobile

10 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 9/12/2023 in #front-end

Page scrolls down to bottom

https://infotelligent-58ac19.webflow.io/infotelligent-vs-zoominfo I didn't give any #id at the end of url, but when I visit the url it's scrolling down to the form. why is this happening?

3 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 9/5/2023 in #front-end

Referrer URL Tracking

I'm trying to get the inital/referrer url of the site where the user entered and store it in a hidden value in the pop-up(which is same on all pages) from and take it as a submission when form is submitted. tried this but wasn't working

<script>
  $(document).ready(function () {
    // Get the Referrer URL
    var referrerURL = document.referrer;

    // Set the Referrer URL as the value of the hidden input field
    $("#name=Last_Conversion_Page_URL__c").val(referrerURL);
  });
</script>

<script>
  $(document).ready(function () {
    // Get the Referrer URL
    var referrerURL = document.referrer;

    // Set the Referrer URL as the value of the hidden input field
    $("#name=Last_Conversion_Page_URL__c").val(referrerURL);
  });
</script>

<input type="hidden" class="last-conversion-fl last_con_url w-input" id="name=Last_Conversion_Page_URL__c" name="Last_Conversion_Page_URL__c" data-name="Last_Conversion_Page_URL__c" value="https://www.wesite.com/pop-up ">

<input type="hidden" class="last-conversion-fl last_con_url w-input" id="name=Last_Conversion_Page_URL__c" name="Last_Conversion_Page_URL__c" data-name="Last_Conversion_Page_URL__c" value="https://www.wesite.com/pop-up ">

how can I achieve this? Is this possible to achieve something like this?

6 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 8/27/2023 in #front-end

Slider Animation help

I'm trying to achieve this slider animation with pagination buttons animation. How can I go about it? Is there any library I can use? If you can please guide me what to search, effect name, would also help.

9 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 8/25/2023 in #front-end

lightgallery.js implimentation

trying to implement a lightbox using lightgallery.js my html looks like this

 <section id="animated-thumbnails-gallery">
      <a href="#"><img src="" /></a>
      <a href="#"><img src="" /></a>
      <a href="#"><img src="" /></a>
      <a href="#"><img src="" /></a>
  </section>

 <section id="animated-thumbnails-gallery">
      <a href="#"><img src="" /></a>
      <a href="#"><img src="" /></a>
      <a href="#"><img src="" /></a>
      <a href="#"><img src="" /></a>
  </section>

and javascript is this

      lightGallery(document.getElementById("animated-thumbnails-gallery"), {
        thumbnail: true,
      });

      lightGallery(document.getElementById("animated-thumbnails-gallery"), {
        thumbnail: true,
      });

i tried using this cdn in head as well as before body tag. but it's not working.

<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/js/lightgallery.min.js" integrity="sha512-b4rL1m5b76KrUhDkj2Vf14Y0l1NtbiNXwV+SzOzLGv6Tz1roJHa70yr8RmTUswrauu2Wgb/xBJPR8v80pQYKtQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/js/lightgallery.min.js" integrity="sha512-b4rL1m5b76KrUhDkj2Vf14Y0l1NtbiNXwV+SzOzLGv6Tz1roJHa70yr8RmTUswrauu2Wgb/xBJPR8v80pQYKtQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

Site link: https://liquid-navbar-88222e.webflow.io/portraits What am I doing wrong?

8 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 7/28/2023 in #front-end

Help with stacked tesimonial cards

https://codepen.io/ahad4387/pen/qBQxewK I'm trying to modify this stacked testimonial card animation. I trying get the front card to translate to left then fade away and then the below card should scale to 1.

@keyframes scaleUp {
  0% {
    transform: scale(1.2) translateY(-5000px);
    opacity: 0;
  }
  20% {
    transform: scale(1.15) translateY(-4000px);
    opacity: 0.1;
  }
  40% {
    transform: scale(1.1) translateY(-3000px);
    opacity: 0.2;
  }
  60% {
    transform: scale(1.05) translateY(-2000px);
    opacity: 0.4;
  }
  80% {
    transform: scale(1.01) translateY(-1000px);
    opacity: 0.8;
  }
  100% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}

@keyframes scaleUp {
  0% {
    transform: scale(1.2) translateY(-5000px);
    opacity: 0;
  }
  20% {
    transform: scale(1.15) translateY(-4000px);
    opacity: 0.1;
  }
  40% {
    transform: scale(1.1) translateY(-3000px);
    opacity: 0.2;
  }
  60% {
    transform: scale(1.05) translateY(-2000px);
    opacity: 0.4;
  }
  80% {
    transform: scale(1.01) translateY(-1000px);
    opacity: 0.8;
  }
  100% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
}

tried changing the translateY to translateX, it isn't really changing anything. Even if i change the distance, it's not affecting the animation. Please help

8 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 7/27/2023 in #front-end

Input elements fixed-width not visible in dev tools.

4 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 7/17/2023 in #front-end

border radius is not working on Border-image-source

I'm trying apply gradient to border. Even if i apply border to wrapper or the gradient-image, border is not working. how should i solve this https://codepen.io/ahad4387/pen/RwqMJom

7 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 7/14/2023 in #front-end

Stacked Testimonials

7 replies

WBWeb Bae

•Created by Abdul Ahad⚡ on 6/18/2023 in #❓︱questions

Finsweet filter

I'm trying to implement finsweet filter, It's only working for single category, can you but please help me out? https://ankurs-amazing-site-08c96b.webflow.io/filter https://preview.webflow.com/preview/ankurs-amazing-site-08c96b?utm_medium=preview_link&utm_source=designer&utm_content=ankurs-amazing-site-08c96b&preview=1165df16b8719ba8d5c1db159d0fc804&pageId=648eeaa96b4fde43a5557f55&workflow=preview

10 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 5/5/2023 in #front-end

Center a text element staying responsive

https://codepen.io/ahad4387/pen/MWPrEJb I'm trying to keep the dark EXPLORE always in the centre while staying responsive. tried using absolute with % on left but it isn't really responsive. How should I approach this?

18 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 4/18/2023 in #front-end

How do I structure the HTML for this?

4 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 4/16/2023 in #front-end

Not able to overflow divs

https://codepen.io/ahad4387/pen/LYgNgqK I'm trying to achieve a slider of the containers. for that, we'll need to overflow the parent .splide__list div. Tried using inline-block on .grid-container and .picture-container, didn't work I'm not understanding why the images are shrinking to fit the viewport even if I duplicate them many times.

3 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 4/10/2023 in #front-end

Detect Selected Label without radio button

I'm trying to recreate this calculator : https://www.thewebflowagency.com/book-a-call What I understand is, they have hidden the radio button and used text label to select the option. recreated this. Then, I'm not able to see which field is selected.(like the focus state) how do i approach this?

10 replies

Gaming

Programming