cadre fleche droite sur fil arraine

ivan94
Les bases HTML/CSS

bonjours, je souhaites faire comme votre forum la flèche sur la fil arraine mais je n'arrives a le mettre

j'ai trouvé le code :

http://cssarrowplease.com/

#fil_ariane
      {
      margin-bottom: 10px;
      font-size:13px;
      }

j'ai ça pour la fil araine 

<div id="content">
        <?php

            $fil = buildBreadcrumb($_GET'm'], ((!isset($_GET'sm']) || $_GET'sm'] == '') ? "index" : $_GET'sm']));
            if(count($fil) > 0)
            {
                echo '<div id="fil_ariane">';

                $i = 0;

                foreach($fil as $url => $item)
                {
                    $url = explode('/', $url);
                    $module = $url[0];

                    $section = "index";
                    if($i>0)
                    $section = $url[0];

                    $output = htmlspecialchars($item);

                    if($i < count($fil)-1 && (count($fil) > 2 && $i<>(count($fil)/2)))
                        $output = '<a href="'.getLienModule($module, $section).'">'.$output.'</a> > ';
                    else if(count($fil) > 2 && $i==(count($fil)/2))
                        $output = '<a href="javascript:void(0);" onclick="history.back(-2);">'.$output.'</a> >';

                    if(count($fil)-1==1 && $i<1)
                        $output = '<a href="'.getLienModule($module, $section).'">'.$output.'</a> > ';
                    else
                        $output = $output;

                    echo $output;
                    $i++;
                }

                echo '</div>';
            }
//leprojet_var_debug($_SESSION);
            echo $pageContent;
            saveUrl($_SERVER'REQUEST_URI']);
        ?>
    </div>

#content
      {
      font-size: 13px;
      border-radius: 4px;
      border: 1px solid #000000;
      background-color: #FFFFFF;
      float: left;
      width: 785px;
      overflow:auto;
      padding-left:10px;
      padding-right:10px;
      }
      #content #fil_ariane
      {
      margin-bottom: 10px;
      font-size:13px;
      }

je n'arrive pas a mettre le cadre avec fleche droit sur les mot de fil arraine

je veux comme sur ce forum

forum > topic > etc...

si vous pouvez m'aider

15 réponses

coloo

tu as un lien pour qu'on t'aide ?

ivan94
Auteur

voilà le lien

http://leprojet.legtux.org/forum.html

Le Projet > Les Forums/Liste des catégories

si je le met le code de la flèche il me fait ça

Le Projet >
<br>
Les Forums/Liste des catégories

etc..

au lieu de mettre sur la même ligne

Le Projet > Les Forums >Liste des catégories

etc..

coloo

J'attends que tu regles ton soucis de fatal error ;)

ivan94
Auteur

JE N4AI PAS DE SOUCIE FATAL

car je n'arrives pas a bien placé mon html css affin de mettre bien la fléche car là il met un saut de ligne hors je n'ai pas mis lol

coloo

Tu n'as pas du me donner le bon lien alors : http://screencast.com/t/7of1ewBM21hF

ivan94
Auteur

je n'ai pas cette érreur

la capture d'écrant j'ai mis ca

if($i < count($fil)-1 && (count($fil) > 2 && $i<>(count($fil)/2)))
                        $output = '<div class="arrow_box"><a href="'.getLienModule($module, $section).'">'.$output.'</a> > ';
                    else if(count($fil) > 2 && $i==(count($fil)/2))
                        $output = '<a href="javascript:void(0);" onclick="history.back(-2);">'.$output.'</a> >';

                    if(count($fil)-1==1 && $i<1)
                        $output = '<a href="'.getLienModule($module, $section).'">'.$output.'</a> ></div> ';
                    else

et ça me donne ca
http://hpics.li/1baf8d6

coloo

C'est bien ton lien ceci

ivan94
Auteur

oui c mon site

mais si on peut m'aidé a faire et mettre un cadre et une fleche sur la fil arraine car là ça me fait des saut de ligne

coloo

Comme je t'ai dit précedemment, je ne peux pas t'aider car je vois une page blanche avec une erreur sql dessus (SQLSTATE[42000]: Syntax error or access violation)

Si tu es sur chrome, fais un ctrl + maj + r pour réinitialiser le cache.

Bon courage =)

ivan94
Auteur

voilà la ligne de l'érreur si tu peut voir pour quoi il affiche l'érreur et aprés on verra pour la flèche

function deletePeopleOnline($logoutForce=false,$loginForce=false){
        global $pdo;

        $sid = (isset($_SESSION'id'])) ? $_SESSION'id'] : -1;

        $req = "DELETE FROM forum_whosonline WHERE";
        if($logoutForce){
            $req .= " membre_id=".$sid;
        }else{
            if($loginForce)
            $req .= " online_ip=".ip2long($_SERVER'REMOTE_ADDR']);
                else
            $req .= " online_time<".time();
        }
        $delete = $pdo->query($req);
    }

si tu conait pk il dit erreur car chez moi il n'affiche pas

et aprés onn verra pour la fléche

merci

coloo

Ok j'ai eu un petit probleme, c'était du a ma connection free qui merdé pour ton site :p

rajoute dans #fil_arianne

display:inline-block ;
ivan94
Auteur

Merci, j'ai mis le display mais bon

sinon j'ai changer l'emplacement du div du cadre fleche

<?php

            $fil = buildBreadcrumb($_GET'm'], ((!isset($_GET'sm']) || $_GET'sm'] == '') ? "index" : $_GET'sm']));
            if(count($fil) > 0)
            {
                echo '<div id="fil_ariane"><div class="arrow_box">';

                $i = 0;

                foreach($fil as $url => $item)
                {
                    $url = explode('/', $url);
                    $module = $url[0];

                    $section = "index";
                    if($i>0)
                    $section = $url[0];

                    $output = htmlspecialchars($item);

                    if($i < count($fil)-1 && (count($fil) > 2 && $i<>(count($fil)/2)))
                        $output = '<a href="'.getLienModule($module, $section).'">'.$output.'</a> > ';
                    else if(count($fil) > 2 && $i==(count($fil)/2))
                        $output = '<a href="javascript:void(0);" onclick="history.back(-2);">'.$output.'</a> >';

                    if(count($fil)-1==1 && $i<1)
                        $output = '<a href="'.getLienModule($module, $section).'">'.$output.'</a> > ';
                    else
                        $output = $output;

                    echo $output;
                    $i++;
                }

                echo '</div></div>';

là on voit bien le cadre avec une grosse flèche

mais comment on lui dit de le mettre a chaque mot j'ai essayer de le mettre dans la page fil apparaître mais ça ne fait pas mon codre

là j'esperes vous pouvez m'aider ou je dois placer

ivan94
Auteur

j'ai retester ça m'a laire bien mais il y a un truc moche si tu peux me'aidé a amélioré

http://leprojet.legtux.org/forum.html

il met
Le Projet Les Forums/Liste des catégories
auu lieu

Le Projet > Les Forums > Liste des catégories

http://leprojet.legtux.org/forum-voirtopic.html?fid=17&num=1
il met

Le ProjetLes Forums/Liste des catégoriesvoirtopic

au lieu

Le Projet > Les Forums > Liste des catégories > voirtopic

http://leprojet.legtux.org/forum-voirmessage.html?fid=17&tid=257&num=1

Le ProjetLes Forums/Liste des catégoriesListe des topicslecture d'un topic

au lieu

Le Projet > Les Forums > Liste des catégories >Liste des topics > lecture d'un topic

/ ********************************************************************************************************************Début du contenu du centre****************************************************************************************************************** /
      #content
      {
      font-size: 13px;
      border-radius: 4px;
      border: 1px solid #000000;
      background-color: #FFFFFF;
      float: left;
      width: 785px;
      overflow:auto;
      padding-left:10px;
      padding-right:10px;
      }
      #content #fil_ariane
      {display:inline-block ;
      margin-bottom: 10px;
      font-size:13px;
      }
.arrow_box {
display:inline-block;
    position: relative;
    background: #88b7d5;
    border: 4px solid #c2e1f5;
}
.arrow_box:after, .arrow_box:before {
    left: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.arrow_box:after {
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #88b7d5;
    border-width: 30px;
    top: 50%;
    margin-top: -30px;
}
.arrow_box:before {
    border-color: rgba(194, 225, 245, 0);
    border-left-color: #c2e1f5;
    border-width: 36px;
    top: 50%;
    margin-top: -36px;
}
/ ********************************************************************************************************************Fin du contenu du centre******************************************************************************************************************** /

<div id="content">
        <?php

            $fil = buildBreadcrumb($_GET'm'], ((!isset($_GET'sm']) || $_GET'sm'] == '') ? "index" : $_GET'sm']));
            if(count($fil) > 0)
            {
                echo '<div id="fil_ariane">';

                $i = 0;

                foreach($fil as $url => $item)
                {
                    $url = explode('/', $url);
                    $module = $url[0];

                    $section = "index";
                    if($i>0)
                    $section = $url[0];

                    $output = htmlspecialchars($item);

                    if($i < count($fil)-1 && (count($fil) > 2 && $i<>(count($fil)/2)))
                        $output = '<div class="arrow_box"><a href="'.getLienModule($module, $section).'">'.$output.'</a></div>';
                    else if(count($fil) > 2 && $i==(count($fil)/2))
                        $output = '<div class="arrow_box"><a href="javascript:void(0);" onclick="history.back(-2);">'.$output.'</a></div>';

                    if(count($fil)-1==1 && $i<1)
                        $output = '<div class="arrow_box"><a href="'.getLienModule($module, $section).'">'.$output.'</a></div> ';
                    else
                        $output = $output;

                    echo $output;
                    $i++;
                }

                echo '</div>';
            }
//leprojet_var_debug($_SESSION);
            echo $pageContent;
            saveUrl($_SERVER'REQUEST_URI']);
        ?>
    </div>

et ma page fil arraine 

<?php
// Par cfillion
$fil_ariane = array();
// index
$fil_ariane'index'] = 'Le Projet';
$fil_ariane'404'] = 'Page inexistante';
$fil_ariane'membre'] = 'Membres';
$fil_ariane'membre/connexion'] = 'Connexion';
$fil_ariane'membre/inscription'] = 'Inscription';
$fil_ariane'membre/profil'] = 'membre/Voir le profil';
$fil_ariane'membre/usercp'] = 'membre/Profil d\'un membre ';
$fil_ariane'liste'] = 'Liste';
$fil_ariane'cours'] = 'Tuto';
$fil_ariane'tuto'] = 'Tuto/Lecture des catégories';
$fil_ariane'tutoriels/afficher'] = 'tutoriels/Lecture d\'un tutoriel';
$fil_ariane'forum'] = 'Les Forums/Liste des catégories';
$fil_ariane'forum/voirmessage'] = 'forum/Liste des topics/lecture d\'un topic';
$fil_ariane'forum/nouveau'] = 'forum/Liste des topics/Création d\'un nouveau message dans le topic';
$fil_ariane'forum/repondre'] = 'forum/lecture d\'un topic/Répondre à un méssage du topic';
$fil_ariane'messagerie/consulter'] = "messagerie/Consulter un fil de discution";
$fil_ariane'messagerie/add'] = "messagerie/Créez un nouveau fil de discution";
$fil_ariane'activites/liste.sortie'] = "activites/Liste des sorties";
$fil_ariane'partenaire/demande.partenariat'] = "partenaire/Demande de partenariat";
// mappage sur les url réelles - par zulad
$fil_mappage = array();

$fil_mappage'Membres'] = 'membre/liste';
$fil_mappage'admin'] = 'admin/index.admin';
$fil_mappage'Connexion'] = 'membre/connexion';
$fil_mappage'Voir le profil'] = 'membre/profil';
$fil_mappage'Profil d\'un membre'] = 'membre/usercp';
$fil_mappage'Liste'] = 'liste/';
$fil_mappage'Tuto'] = 'cours/';
$fil_mappage'Lecture d\'un tutoriel'] = 'tutoriels/afficher';
$fil_mappage'Inscription'] = 'membre/inscription';
$fil_mappage'Les Forums/Liste des catégories'] = 'forum/';
$fil_mappage'lecture d\'un topic'] = 'forum/voirmessage';
$fil_mappage'Liste des topics'] = 'forum/voirtopic';
$fil_mappage'Création d\'un nouveau message dans le topic'] = 'forum/nouveau';
$fil_mappage'Répondre à un méssage du topic'] = 'forum/repondre';
$fil_mappage'Consulter un fil de discution'] = 'messagerie/consulter';
$fil_mappage'Créez un nouveau fil de discution'] = 'messagerie/add';
$fil_mappage'messagerie'] = 'messagerie/';
$fil_mappage'Liste des sorties'] = 'activites/liste.sortie';
$fil_mappage'activites'] = 'activites/liste.sortie';
$fil_mappage'partenaire'] = 'partenaire/';
$fil_mappage'Demande de partenariat'] = 'partenaire/demande.partenariat';
$fil_mappage'tutoriels'] = 'tutoriels/';
$fil_mappage'Lecture d\'un tutoriel'] = 'tutoriels/afficher';
?>

si tu pouvais m'aidé a fair bien la présentation cadre et fléche qui ne soit pas gros mais bien présenté

ca sera sympas

Nairolf

Bon déjà ton orthographe, fait un minimum d'effort car c'est pas souvent lisible, ensuite je pense que tu es parti dans un projet trop gros pour toi, car tu sembles encore débutant en HTML/CSS et PHP.

Car par exemple mettre $output = $output; est strictement inutile.

Ici il doit y avoir une erreur $i<>(count($fil)/2)

Et ensuite comment tu structures tes tableaux bizarrement car mettre:

$fil_ariane = array();

$fil_ariane'index'] = 'Le Projet';
$fil_ariane'404'] = 'Page inexistante';
$fil_ariane'membre'] = 'Membres';
...]

Revient à:

$fil_ariane = array (
'index' => 'Le Projet',
'404' => 'Page inexistante',
'membre' => 'Membres',
...]
);
Et ça m'étonne une "erreur" comme ça alors que tu as tu as compris que les crochets ne sont pas important dans les conditions quand il y a qu'une commande à faire.

Et sinon pour tes flèches je vois ce que tu veux faire, et une recherches Google vas vite à faire et tu trouves donc ton résultat facilement.

http://all-for-design.com/tutoriaux/tutoriel-realiser-un-fil-dariane-avance-en-css/

Ensuite je pense que pour ta fonction tu te complique la vie, mais bon je peux pas t'aider car je vois pas tout le code non plus, et si tu suis les tutoriels de Grafikart, tu as du voir celui où on se "démerde seul".

Sur ce bonne continuation.

Benjamin Derepas

Je ne suis pas sur d'avoir tout compris, j'ai un peu survolé les commentaires précédant. Mais si tu cherches seulement à avoir une fleche dans ton breadcrump, c'est simple.
Un breadcrump est généralement composé d'un ul, plus des li ayants chacuns un liens.
Dans ton css, définie ce qu'il faut pour que les a / li aient ce background.
En n'oubliant pas un petit :

ul li:last-child()
{
background:none;
}