Discussion :

[EvaKaatz]

Bonjour,

Tout d'abord j'espère que je suis au bon endroit pour demander ça. Je début tout juste dans le développement web et j'aurais besoin d'aide, voici mon problème:
J'aimerai qu'au click sur une image ça me renvoie à une ancre qui est sur une autre page que celle affichée mais je ne sais pas du tout comment faire, auriez-vous une solution pour moi?

Merci d'avance !

[psychadelic]

Code JavaScript :

Sélectionner tout - Visualiser dans une fenêtre à part

document.location.href = 'https://developer.mozilla.org/fr/docs/Web/HTML/Element/a#Attributs_obsolètes';

depuis html5 les ancres permettent de pointer sur les ID de tout éléments; l'attribut name n'est plus valable pour cette action.

[EvaKaatz]

Merci pour ta réponse !

Juste, je suis sous WP, est-ce que ça change quelque chose pour l'url sachant que mon site n'est pas encore en ligne?

[EvaKaatz]

Mmmh après essai ça ne fonctionne pas
En fait mon index c'est un one page avec 2 parties et j'aimerai que le lien amène à la seconde partie du one page sauf qu'à chaque fois ça me ramène à la première partie, ça ne prend pas en compte mes ancres

Dans mon index j'ai ça:

Code HTML :

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
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<?php get_header(); ?>
 
    <div class="home">
        <img src="<?php echo get_template_directory_uri() ?>/img/home/illustration_eva_spessotto.png" alt="Illustration Eva" class="home_illustration">	
 
        <div id=index_element>
 
            <h1>Eva Spessotto</h1>
            <h3>Graphiste - Illustratrice</h3>
            <p>Etudiante en Communication Digitale et Webmastering à l’IUT de Tarbes, je suis aussi spécialisée dans le design  graphique et l’illustration.</p>
        </div>
        <img src="<?php echo get_template_directory_uri() ?>/img/home/hand.png" class="index_hand" id="scroll_hand">
    </div> 
 
	<main class="portfolio" id="here">
            <?php get_template_part('nav'); ?>
            <?php get_template_part('sous_menu'); ?>
 
			<div class="slider">
                <?php 
                    $args = array(
                                'post_type' => 'post',
                                'meta_query' => array(
                                    array(
                                        'key' => 'works',
                                        'compare' => 'EXISTS'
                                    )                         
                                )
                    );
 
                    query_posts($args);
                    if (have_posts() ):
                        while (have_posts() ): the_post();
 
                ?>               
                    <div class="slide">
                        <div class="background">
                           <h2 id="title"><?php the_title(); ?></h2>
                        </div>
                        <a href="<?php echo the_permalink(); ?>"><?php the_excerpt(); ?></a>
                    </div>                
                <?php                
                        endwhile;
                    endif;
                ?>     
 
			</div>
         </main>
 
 <?php get_footer(); ?>
 
 <script type="text/javascript">
     
  var iScrollPos = 0;
            $(window).scroll(function () {
 
       var iCurScrollPos = $(this).scrollTop();
 
            if (iCurScrollPos > iScrollPos) {
                $(".portfolio").css({ 
                    "transition":"all 2s ease-in-out",
                    "top":"0%",
                });
 
                $(".home").css({
                    "top":"-100%",
                    "transition":"all 2s ease"
                });
 
             }
        
            else{
                $(".home").css({
                    "top":"0%",
                    "transition":"all 2s ease-in-out"
                });
 
                $(".portfolio").css({
                    "top":"150%",
                    "transition":" 2s ease-in-out"
                });
            }
 
                iScrollPos = iCurScrollPos;
            });
 
 
 
        $("#scroll_hand").click(function() {
        $('html,body').animate({
            scrollTop: $(".portfolio").offset().top},
            'slow');
         });
 
        $(document).ready(function() {
            $('.slider').mousewheel(function(e, delta) {
                this.scrollLeft -= (delta * 40);
                e.preventDefault();
            });
 
            $("#btn_illustration").click(function(){
                montrer_cacher("illustration");
            });
 
            $("#btn_photographie").click(function(){
                montrer_cacher("photographie");
            });
 
            $("#btn_edition").click(function(){
                montrer_cacher("edition");
            });
 
            $("#btn_identite_visuelle").click(function(){
                montrer_cacher("identite_visuelle");
            });
 
            $("#btn_affiche").click(function(){
                montrer_cacher("affiche");
            });
 
        });
 
</script>
<br>

Et la page Single dans laquelle il y a la div à cliquer:

Code HTML :

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
<?php get_header(); ?>
<?php get_template_part('nav'); ?>
 
       <div class="return" onclick="myFunction()">
           <img id="back" src="<?php echo get_template_directory_uri() ?>/img/hand_back.png">
       </div>
 
		<?php
                // Start the loop.
                while ( have_posts() ) : the_post();
            
            the_content();
 
                        // End of the loop.
                endwhile;
                ?>
 
<?php get_footer();   ?>
 
<script type="text/javascript">
   function myFunction() {
    document.location.href= "http://localhost/portfolio_test/index#here";
}
</script>

J'aimerai quand sur la page single, quand on clique sur "#return" on arrive sur la partie "#here" de l'index sauf qu'à chaque fois ça me ramène en haut à la <div class="home">

[psychadelic]

il doit y avoir un système de Redirection d'URL sur le site, (dans le fichier .htaccess ou autres méthodes).
il faut d’abord agir la pour obtenir le résultat que tu souhaite

[EvaKaatz]

Ok je vais regarder ça merci !