Bonjour à tous,

Je cale sur une fonction qui me permettrais d'afficher un iframe avec un effet "slide" jquery.

Pouvez-vous m'aider sur ce coup ?



Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
 
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
     	<script>
  $(function() {
    // run the currently selected effect
    function runEffect() {
      // get effect type from
      var selectedEffect = $( "#effectTypes" ).val();
 
      // most effect types need no options passed by default
      var options = {};
      // some effects have required parameters
      if ( selectedEffect === "slide" ) {
        options = { percent: 0 };
      } else if ( selectedEffect === "size" ) {
        options = { to: { width: 200, height: 60 } };
      }
 
      // run the effect
      $( "#effect" ).toggle( selectedEffect, options, 500 );
    };
 
    // set effect from select menu value
    $( "#button" ).click(function() {
      runEffect();
    });
  });
  </script>
 
<style>
.toggler {
    width: 500px;
    height: 135px;
  }
  #button {
    padding: .5em 1em;
    text-decoration: none;
  }
  #effect {
    position: relative;
    width: 240px;
    height: 135px;
    padding: 0.4em;
  }
</style>
 
 
 
<div class="toggler">
  <div id="effect">
 
    <p>
   <iframe src="https://calendar.google.com/calendar/embed?title=Bikers%20Events&amp;showTabs=0&amp;showCalendars=0&amp;showTz=0&amp;height=200&amp;wkst=2&amp;bgcolor=%23FFFFFF&amp;src=gghfcalendar%40gmail.com&amp;color=%231B887A&amp;ctz=Europe%2FBrussels" style="border-width:0" width="600" height="500" frameborder="0" scrolling="no"></iframe>
    </p>
  </div>
</div>
 
 
<select name="effects" id="effectTypes" style="visibility:hidden">
  <option value="slide">Slide</option>
</select>
 
<button id="button" >Run Effect</button>