WebSite X5Help Center

 
Ionescu C.
Ionescu C.
User

Any option to zoom or make text bigger when mouse over to a text in the blog sec  en

Autor: Ionescu C.
Visitado 1234, Followers 2, Compartido 0  

Hello, 

Is there any option to zoom or make text bigger/smaller when mouse over (hover) to a text in the blog section?

In the HTML part you can put the effects or add a button, in the blog what animation can be used?

Regards, 

Cristi

Publicado en
14 RESPUESTAS - 2 úTIL - 1 CORRECTO
Axel  
Axel  
User

Hello Ionescu,

Here a long code which is works.. Save it into html file and test it

<html>
<style type="text/css">

  span {font-size: x-small}

</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin

function convertPreBlocks() {}

var regular = "x-small";

function bigger(thing){

thing.style.fontSize = "large";

siblingElement = thing.previousSibling;

while(siblingElement) {

if(siblingElement.tagName=="SPAN") {

siblingElement.style.fontSize = "medium";

break;

}

siblingElement = siblingElement.previousSibling;

}

siblingElement = thing.nextSibling;

while(siblingElement) {

if(siblingElement.tagName=="SPAN") {

siblingElement.style.fontSize = "medium";

break;

}

siblingElement = siblingElement.nextSibling;

}

}

function normal(thing){

thing.style.fontSize = regular;

siblingElement = thing.previousSibling;

while(siblingElement) {

if(siblingElement.tagName=="SPAN") {

siblingElement.style.fontSize = regular;

break;

}

siblingElement = siblingElement.previousSibling;

}

siblingElement = thing.nextSibling;

while(siblingElement) {

if(siblingElement.tagName=="SPAN") {

siblingElement.style.fontSize = regular;

break;

}

siblingElement = siblingElement.nextSibling;

}

}

//  End -->

</script>
</HEAD>
<BODY>
Passez la souris sur les phrases ci-dessous<br />



<br /><br />

<span onmouseover="bigger(this)" onmouseout="normal(this)">Mais il y a, tout au long des marchés de Provence</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">Tant de filles jolies, tant de filles jolies</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">Qu'au milieu des fenouils, melons et céleris</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">J'ai bien de temps en temps quelques idées qui dansent</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">Voyageur de la nuit, moi qui en ribambelle</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">Ai croisé des regards que je ne voyais pas</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">J'ai hâte au point du jour de trouver sur mes pas</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">Ces filles du soleil qui rient et qui m'appellent</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">Le matin au marché</span><br/>

<span onmouseover="bigger(this)" onmouseout="normal(this)">Paroles: Louis Amade. Musique: Gilbert Bécaud</span><br/>

</html>

Enjoy.

Axel

Leer más
Publicado en de Axel  
Ionescu C.
Ionescu C.
User
Autor

Hello Alex, 

I'm talking about the text that goes into an article that is it published in the Blog section, where unfortunatly you can't go into Properties >  "expert mode" to add the code that you gave me.

Regards, 

Cristi

Leer más
Publicado en de Ionescu C.
Axel  
Axel  
User

Grrrr. I am not using blog part. I don't know how to in this case. yell

Leer más
Publicado en de Axel  
John S.
John S.
User

You can set the  html code "on" and then use code like this :

<p nMouseOver="this.style.fontSize='30px'" onMouseOut="this.style.fontSize='15px'" >Hello folks</p>

Leer más
Publicado en de John S.
John S.
John S.
User

I hope you have discovered the typo.

<p nMouseOver   should have been <p onMouseOver

You can also have a link in the code if needed.

Leer más
Publicado en de John S.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Usuario del mes ESUsuario del mes PT
Ionescu C.
... ...  Is there any option to zoom or make text bigger/smaller when mouse over (hover) to a text in the blog section? ... ... 

... LINK BLOG ...?...

ciao

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Ionescu C.
Ionescu C.
User
Autor

Hello John S. I have tried with the code provided but it not the actioned needed.

I only want one word and an animation for that specific word, with the p - parameter the word will be placed on  the next paragraph.

@KolAsim - link to the blog is: 
http://focsanii.ro/IulianaPopa/blog/index.php?burnout-ul-parental

I have attach a snip with the text that I need to put the animation.

The word in yellow, I want to animate: zoom in - zoom out, move sideways some kind oa nimation, but only that specific word not the whole phrase.

Regards,

Cristi

Leer más
Publicado en de Ionescu C.
Fabio B.
Fabio B.
User

@Ionescu: if you like you can also try this way

Go into the the map and choose the special page of your blog then select property tab and put this code before closing head tag:

<style>
div[id^="imBlogPost_"] div:hover, div[id^="imBlogPost_"] div:hover::first-line {
font-size: 20pt !important;
}
</style>

Customize the strong value.

Leer más
Publicado en de Fabio B.
Fabio B.
Fabio B.
User

<style>
div[id^="imBlogPost_"] div:hover, div[id^="imBlogPost_"] div:hover::first-line, div[id^="imBlogPost_"] span:hover {
font-size: 20pt !important;
}
</style>

Leer más
Publicado en de Fabio B.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Usuario del mes ESUsuario del mes PT
Ionescu C.
... ...  @KolAsim - link to the blog is:  http://focsanii.ro/IulianaPopa/blog/index.php?burnout-ul-parental ... ... ... 

(It > En) ... I thought you needed the code for the paragraphs, so it's easier ...
... to not do the carriage return, use this string of code:
<span onMouseOver="this.style.fontSize='24px'" onMouseOut="this.style.fontSize='14px'" > TEXT </span>

.

ciao

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
John S.
John S.
User

oh - Sorry - I did not read the text well. Use span instead of p

oncus <span style='color:white;' onMouseOver="this.style.fontSize='30px'" onMouseOut="this.style.fontSize='15px'" >Hello folks</span> metu

Leer más
Publicado en de John S.
Ionescu C.
Ionescu C.
User
Autor

Thank you all for the answers provided.

It is working.

But there is something weird if I change the font from the app to ROBOT for example, size 14, for the text, for somereason it is not working anymore.

This is the code used:

<DIV align="center"><b>text before bla bla bla <span style='color:orange;' onMouseOver="this.style.fontSize='30px'" onMouseOut="this.style.fontSize='15px'" >text that changes size</span>!</b></DIV>

Regards, 

Cristi

Leer más
Publicado en de Ionescu C.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Usuario del mes ESUsuario del mes PT

<span style='color:orange;font-family:roboto' onMouseOver="this.style.fontSize='24px'" onMouseOut="this.style.fontSize='14px'" > TEXT </span>

ciao

Leer más
Publicado en de  ‪ KolAsim ‪ ‪