Se connecter / S'enregistrer

Résolu Html, forum, passer une "src image" à "bgimage"

Solutions (10)
Tags :
  • table
  • Cellspacing
  • Programmation
|
Voici le code en question :

<table width=100% cellspacing="0" style='padding: 0;'><tr><td align=left class='nopad'><a href="{ipb.vars['home_url']}"><img src='style_images/<#IMG_DIR#>/top_left.jpg' style='vertical-align:top' alt='Pop' border='0' /></a></td>

En gros c'est pour un forum un peu vieux. Actuellement la bannière pousse un bouton "faire un don paypal". J'aimerais que ce bouton se retrouve au-dessus de la bannière et pas à coté.

Ne sachant pas surélever dans des calques vitrtuel si ça existe ^^, je me suis dis tient à une époque je me souviens qu'on pouvait mettre des images en background, j'ai essayé mais je n'y arrive pas :( 

Merci d'avance :) 


Xen
Contenus similaires
Meilleure solution
partage
, Modérateur |
Par contre, là je vois qu'il y a deux images, ça permet de pouvoir étirer l'image sans avoir de problème, de manière a ce que l'image de gauche soit parfaitement à gauche, et l'image de droite parfaitement à droite, avec ce qu'on veut au milieu.

Est-ce que tu veux garder ce principe, ou est-ce que tu vas mettre une image de taille fixe au milieu, avec le bouton paypal au-dessus ?

J'ai fait un essai, dans ton code, remplace la <table> dont tu as mis le code dans ton 1er message (elle continue, remplace jusqu'à la fermeture de </table>) par ça:
  1. <div style="background: url('style_images/warfo_old/top_left.jpg') repeat; height: 100px;">
  2. <div style="text-align: center; margin: 0pt auto; padding: 30px 0pt 0pt;">
  3. <!--le code de ton bouton paypal ici-->
  4. </div>
  5. </div>


Bon, j'ai utilisé l'image du site, mais tu vas certainement devoir arranger ça.

Ensuite, j'ai mis l'image en mode mosaïque, elle se répète sur toute la longueur, tu peux enlever ça en remplaçant "repeat" par "no-repeat" une fois que tu auras ta bonne bannière.
  • Commenter cette solution |
Score
0
òh
òi
|
Meilleure réponse sélectionnée par Xenarkzdz.
  • Commenter cette réponse |
Score
0
òh
òi
|
Et bien grand merci à toi :) 

Je test ça quand je rentre ce soir car là j'ai des urgences ...

Sinon je pense gardé le principe des images extensibles car c'est très utiles.

Je te répond en détail quand j'ai fini :) 


Encore et encore merci


Xen
  • Commenter cette réponse |
Score
0
òh
òi
|
Je ne pourrais pas te donner la page sur laquelle je travail car c'est un skin qui est visible qu'en admin car elle est nouvelle.
Par contre comme il existe les autres skin et que je pars de ceux là pas de souchis :D 

http://forum.warhammer-forum.com/index.php?act=idx

(c'est pas la page d'accueil mais bien la page forum).

Et ce que je veux modif c'est la bannière, passé l'image qu'on voit en bg pour que je puisse mettre le btn paypal "faire un don"
au dessus.

Voilà :D 

En tout cas merci beauuuucouuuup ;) 


Xen
  • Commenter cette réponse |
Score
0
òh
òi
, Modérateur |
Non, mais quand je dis de donner un lien vers le site, je ne vais pas éditer directement le site.
C'est juste que c'est plus simple de travailler avec le résultat, tu donnes juste un lien vers la page que tu veux modifier. Je regarde les modifications qu'il faut faire, et je te dis les modifications à apporter. :) 
  • Commenter cette réponse |
Score
0
òh
òi
|
Ok, je pensais qu'il fallait un fichier externe pour que le css dans mon code fonctionne.

C'est très gentil de ta part de te proposer mais c'est un site communautaire de 10000 personnes actif... et je ne peu pas me permettre de prendre le risque, déjà on me confis la tache de m'en occuper mes les mecs stresses quand même pas mal, ça fait 7ans que le forum existe.

Je ne met nullement ton intégrité en doute, mais c'est pas moi qui peut prendre cette décision, ça serrait mon site perso (flash) que je n'arrive pas à finir je te laisserais les commandes ^^

Qu'est ce que je pourrais copier pour que tu puisse m'aider?
  • Commenter cette réponse |
Score
0
òh
òi
, Modérateur |
Le CSS n'est pas forcément mis dans un fichier à part, il peut être ajouté sur un élément spécifique avec l'attribut style, comme tu l'as fait dans ton message 2.

Sinon le plus simple serait de donner un lien vers ton site, et je te fais ça.
  • Commenter cette réponse |
Score
0
òh
òi
|
Le problème c'est que je suis graphiste avec pas mal de notion de programmation mais pas plus que ça.

Là je rend service à ma communauté en leur fessant un skin, le problème c'est que de base le "faire un don" à était mis entre deux bout de bannière et moi j'ai envie que ça passe au-dessus d'une longue bannière.

A savoir que je passe par une interface d'admin pour le skin du forum, j'ai accès à pas mal de fichier mais de là à créer des CSS je sais pas trop comment m'y prendre. Je retouche un peu l'html mais créer un doc à mettre sur leur ftp, j'avoue là j'suis un peu perdu donc je préfèrerais la solution 2.

Pour ce qui est du lien, j'aimerais que tout fonctionne comme avant peu importe la manière et là je sais juste que le lien renvoi vers le site (classique).

J'ai l'impression que tu es calé, ne me lâche pas je suis un graphiste sans dev et je galère ^^'''


Xen
  • Commenter cette réponse |
Score
0
òh
òi
, Modérateur |
Salut,

1) Pour pouvoir surélever, il faudrait positionner tes éléments en absolu et pas en relatif (en CSS, position:absolute) et enfin utiliser la propriété CSS z-index qui te permet de monter/descendre des calques.

2) Sinon, tu peux toujours mettre l'image en background avec du CSS là aussi (avec la propriété background).

Dans ton cas, il faut aussi noter que tu as un lien sur ton image, que tu n'aurais pas besoin de changer dans le cas 1, mais dans le cas 2, il faudrait utiliser l'évènement onclick sur ton <td> afin de savoir quand c'est cliqué, pour rediriger vers la page d'accueil (si bien sûr tu veux conserver ce lien).
  • Commenter cette réponse |
Score
0
òh
òi
|
Je viens d'essayé un truc mais l'image disparait...

<table width=100% cellspacing="0" style='padding: 0;'><tr><td align=left class='nopad' style="background-image:url('style_images/<#IMG_DIR#>/top_left.jpg ');"style='vertical-align:top' alt='Warfo' border='0'></td>

Je sais, je ne suis pas doué :D 
  • Commenter cette réponse |

Ce n'est pas ce que vous cherchiez ?

Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS