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 10/8/2024 in #front-end

How would you approach this button?

29 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 10/1/2024 in #front-end

link with ID is reloading the page instead of scrolling to the section

2 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 9/21/2024 in #front-end

How to approach the text highlight with a vector.

8 replies

KPCKevin Powell - Community

•Created by Abdul Ahad⚡ on 9/7/2024 in #front-end

How do I make background transparent for only specific parts

12 replies

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

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

Gaming

Programming