PC SOFT

GRUPOS DE DISCUSSÃO PROFISSIONAL
WINDEVWEBDEV e WINDEV Mobile

Inicio → WEBDEV 2024 → balise <p> et pptés (style) via javascript
balise <p> et pptés (style) via javascript
Iniciado por damien.lep, fev., 09 2006 4:49 PM - 3 respostas
Publicado em fevereiro, 09 2006 - 4:49 PM
Bonjour a tous !


Je suis en train de programmer en Javascript une
petite news pour mon site (via un champ HTML) :

je charge une image style bloc note que j agrandie progressivement
jusqu a une certaine hauteur (via un setinterval).
J utilise aussi une balise <p> pour le text de la news,
mais malheureusement je n arrive a utiliser aucune des pptes de style
sur cette balise !

Autant avec <a> j y arrive, autant la non !

Par exemple :
code HTML : <p name = "NewsParag" stle="visibility:hidden;position:absolute;color:#FFFFFF;">DuTexte</p>

et en javascript :
var objP=document.getElementById("NewsParag");
objP.style.visibility='visible';

ou meme objP.style.topD1;

Ca ne semble pas marcher sur cette balise,
ni sur div d ailleur ! J ai essaye en passant par
getelementByTag("p"), meme combat !


Pourriez vous m aider ??
Damien.
Publicado em fevereiro, 09 2006 - 5:11 PM
En fait j utilise finalement une bonne vieille balise <a>,
et le text semble en forme !

Il me reste quand meme une chose :

Je n arrive toujours pas a savoir quel est/sera la hauteur du
champ <a name="NewsTxt"> ...

Une fois que tout est rempli et fini, je fais un test :
var objA=document.getElementById("NewsTxt");
alert(objA.style.height);


=> il me renvoye undefined !!!
Je suis oblige de fixer manuellement une hauteur pour le texte,
l astuce sera peut etre de calculer cette hauteur au moment de la saisie ..
Publicado em fevereiro, 09 2006 - 6:53 PM
Salut

Tu devrais essayer avec id= à la place de name=.

<p id="NewsParag" ...

Ce sera sans doute mieux pour getElementById.


--
Ciao
Pat Biker
http://aaa.windev.free.fr/php/blog.php


>code HTML : <p name = "NewsParag" stle="visibility:hidden;position:absolute;color:#FFFFFF;">DuTexte</p>
Publicado em fevereiro, 10 2006 - 10:18 AM
En fait je suis passe en balise <a>,
mais effectivement j ai mis des id a la place des name :
ca marchait sous IE mais pas sous NetScape et FireFox ....
Avec le id pas de probleme ...

Par contre pour le champ img c est un name, id ne marche pas ...
J espere qu un jour ils arriveront a faire qqchose de coherent !


Voila pour ceux que ca interesse, le bout de code a mettre dans le
champ html (via une fonction, ce serait donc du DHTML ??? lol).
Il vous faudra juste trouver une image pour la box news, et mettre le champ html
en largeur, hauteur variable et debordement visible, et bien sur dynamique.
Puis sur initialisation de la page, MonChampHTML=NewsHTML()

PS :
Les premieres variables vous permettent de positionner un peu le tout ...
(ce n est qu un essai)



CODE >>>>>>>>>>>>>>>>>>>>>>>>>>>>>


FONCTION NewsHTML()

sHTML est une chaîne
ilTop est un entierD1
ilPlusNews est un entier4
iHauteurText est un entier–
sNews est une chaîne=[
Bonjour les petits, bienvenu sur le site de PICHAVANT SURFING.
Nous vous souhaitons un agréable sejour ainsi qu'une agréable journée !<BR>
Cedric de Pichavant.
]

sHTML=[
<BODY>
<a onclick="LanceEnClose()">
<IMG name='ImageNews' SRC='news.gif' height=0 border=0 style="cursor:pointer;">
</a>
<a onclick="LanceEnClose()" id = "NewsTxt" style="cursor:pointer;visibility:hidden;position:absolute;top:441;left:600;fontSize;color:#FFFFFF;font-weight:bold;text-decoration:underline;">NEWS</a>
<a onclick="LanceEnClose()" id = "NewsParag" style="cursor:pointer;visibility:hidden;position:absolute;text-decoration:none;top:
]+(ilTop-iHauteurText)+[
;left:510;width:270;fontSize;color:#FFFFFF;">
]+sNews+[
</a>
<SCRIPT type="text/javascript">
<!--
var attente;

//--------------------------------------------------------------------
// Quelques Fonctions
//--------------------------------------------------------------------
function EnLarge() {
var objA=document.getElementById("NewsTxt");
var objP=document.getElementById("NewsParag");
var nHeight;
var sTop;
var iTop;
nHeight=document.ImageNews.height;
if (nHeight<
]+(iHauteurText+ilPlusNews)+[
) {
document.ImageNews.height=nHeight+3;
document.ImageNews.vspace=document.ImageNews.vspace-3;
sTop=objA.style.top
sTop=sTop.replace(/px/,"");
iTop=eval(sTop+'-3');
objA.style.top=iTop;
if (iTop<435) { objA.style.visibility = 'visible'; }
}
else
{
clearInterval(attente);
objA.style.visibility = 'visible';
objP.style.visibility = 'visible';
}
}

//---------------------
function EnClose() {
var nHeight;
var objA=document.getElementById("NewsTxt");
nHeight=document.ImageNews.height;
if (nHeight>0)
{
document.ImageNews.height=nHeight-5;
document.ImageNews.vspace=document.ImageNews.vspace+5;
sTop=objA.style.top
sTop=sTop.replace(/px/,"");
iTop=eval(sTop+'+5');
objA.style.top=iTop;
if (iTop>430) { objA.style.visibility = 'hidden'; }
}
else
{
clearInterval(attente);
document.ImageNews.style.visibility='hidden';
objA.style.visibility = 'hidden';
}
}

//---------------------
function LanceEnClose()
{
var objP=document.getElementById("NewsParag");
objP.style.visibility='hidden';
attente=window.setInterval('EnClose();',10);
}

//---------------------
function LanceEnLarge() { attente = window.setInterval('EnLarge();',10); }

//---------------------
function Defilement()
{
var objP=document.getElementById("NewsParag");
var sText;
}






//--------------------------------------------------------------------
//C est parti !
//--------------------------------------------------------------------
var nHeightO;
var nWidth05;
var nVspaceOC8;
var nHspcaeOI0;
document.ImageNews.height=nHeightO;
document.ImageNews.width=nWidth;
document.ImageNews.vspace=nVspaceO;
document.ImageNews.hspace=nHspcaeO;

LanceEnLarge(); //Vous pouvez mettre ceci sur le chargement onload de la page ...

//-->
</SCRIPT>
</BODY>
]


RENVOYER shtml