Streaming live at 10am (PST)

(SOLVED) setTimeout function to redirect to a specific url


#1

Hi there :slight_smile:

I was wondering if you guys could help me with I think is a relativ simple task.
I would like to set up a custom code button, where when clicked, a function will wait 2 seconds before redirecting to a specific url.

I inspired myself from the w3school.com setTimeout function example but I don’t know how to replace the alarm function with a specific url like www.example.com… for example :wink:

<button onclick="myFunction()">back home</button>

    <script>
    function myFunction() {
        setTimeout(function(){ alert("Hello"); }, 2000);
    }
    </script>

Any idea ?
Thank you !


#2

Hey @anthonysalamin try this:

<button onclick="myFunction()">back home</button>

<script>
function myFunction() {
    setTimeout(function(){ 

      window.location.href = "https://www.example.com";

}, 2000);
}
</script>

#3

Amazing, it works !
Thank you @justin_c :slight_smile:


#4

Hi @justin_c,

I wanted to ask you, would it be possible, in addition to redirecting to a specific page, also trigger a specific button (on that specific page) to “trigger itself” after the setTimeout function ?

Here is my issue:

I build a layout with the isotope plugin system (masonry layout style). Everything works more or less fine except the button that shows every items (data-filter=*) needs to be pressed so that the grid arranges itself correctely. That specific button has an id=“all”.

I was thinking of something like this (please don’t laugh)

when (window with new location).ready
  (do a click function) {
  button with id="all" is triggered
}

Thank you for any helps or tips :slight_smile:
Anthony


#5

Hi @anthonysalamin , I think your best bet here would be to use a function directly from isotope. I’m sure they provide a JS method that lets you capture the same functionality as a button press.

So you could do something like “On page load -> do this function”, and the function there would be the same behavior as clicking that button.

Have you looked into the isotope docs to see if they provide this?


#6

Hi there @justin_c, thank you for getting back !
Yes I search around and found some easy isotope initialisation tip on stackoverflow to filter directely a spcecific set of items which would look like this:

 // init Isotope
 var $grid = $('.grid').isotope({
 itemSelector: '.w-dyn-item',
 layoutMode: 'fitRows',
 filter: '.whateveriwant'
 });

The problem is:
I took a snipet of isotope code that contains an already coded initialization of isotope that looks different than the simple syntax above becausethe snipet contains code that offers people a search option. The initialization code I have looks like this and don’t know where and how I should write my “filter function”:

 // init Isotope
  const $grid = $('.grid').isotope({
      itemSelector: '.w-dyn-item',
      stagger: 30,
  		filter: function() {
      	var $this = $(this);
      	var searchResult = qsRegex ? $this.text().match( qsRegex ) : true;
      	var buttonResult = buttonFilter ? $this.is( buttonFilter ) : true;
      	return searchResult && buttonResult;
    	}
  });

Now I know this isn’t Webflow scope of support nor it is the one of isotope… just asking around if someone has an idea that could help me figure things out :slight_smile: