Jump to content


  • Posts

  • Joined

  • Last visited

Posts posted by TrinitaGirl

  1. Oh, sorry just one more thing:


    You tell me that I should not try to integrate it in my blog.

    But the reason I make all these research -except pure fun- is that I'm making a blog which goal is to teach to "other """Blondes""" " how to make and personalize a blog on Blogger...


    Here's why I have to test it on Blogger..


    How can I do, then? Do you think I must create a web site that will help me to learn about gsap and css, javascript html etc?



  2. Hi Carl,


    Thanks a LOT for your response, tips and interesting links.


    So I will use those recommendations to learn about gsap first.


    About my menu > I wanted to get a Gsap code because my result with this code is so slow an unesthetic / and uncompatible with some browsers,

    and most of all because it tends to become a menu with complex other animations and I wanted to make everything with gsap from the beginning.


    Could you please tell me what kind of code did I use for my result?

    Is it Javascript without any sort of library or pluggin?


    Thanks a lot


    Trinita Girl

  3. Hi everybody!


    By advance, please excuse:

    1. my english (I'm french, and I don't find any good answers about Gsap on french forums...)

    2. my less of knowledge about coding... I know what is Code for.. 2 weeks..

    3. my (a bit) blonde brain..

    But I got faith and I'm ready to learn!!!


    So, here's the situation:

    My final goal is to make a full personalized menu for my blog, that contains very seamless animations.

    The first animation (which I'm testing now) is color changing of the buttons' letters.

    The second one will be the "deployment" of an image that "get out" behind each button and then come in.

    Both animations will start "on mouse over" and when the button is clicked and the relative page is activated.


    My first question is about the first, simple animation: color of the buttons.


    What I'v already done:

    - created a drawn menu on Gimp

    - created the same image but with each button in right color for activated state

    - I've search for a few weeks on tutorials and forums, and found a code that works


    "A code that works"... BUT:

    • it seems to work only on certain machines (don't understand why it works on my mac on Google Chrome but not on my office's PC on Google Chrome too!)
    • and most of all, it is no seamless at all! (got to wait a few seconds with mouse over before the -images charge and- color changes.


    I read some interesting stuffs about the "wonderful Gsap library". But it's very difficult for me to understand how to make the right gsap code that is very complicated for me compares to my actual code (I don't even know if it's "simple javascript" code or something else - you will see that).


    Could you please give me a simple explanation of what I need to do in my case, or even indicate the right code to me..?


    Here's my code:

    <img name="Menu" src="https://photos-4.dropbox.com/s/mpmuozbm5zaaj6j/base%20onglets%20translucides%20koba%C3%AF%20crash%20test%20gelly%20texte.png" width="960" height="95" border="0" usemap="#menu jelly kobai" />
    <map name="menu jelly kobai">
    <area title="Accueil" shape="rect" coords="4,27,117,93" 
    href="http://kobai-uneblondeetblogger.blogspot.fr/" onmouseover="document.Menu.src='https://photos-4.dropbox.com/s/dsltunaowxbg0e3/menu%20bouton%20accueil%20survol.png'" onmouseout="document.Menu.src='https://photos-4.dropbox.com/s/mpmuozbm5zaaj6j/base%20onglets%20translucides%20koba%c3%af%20crash%20test%20gelly%20texte.png'"
    onclick="document.Menu.src='https://photos-4.dropbox.com/s/dsltunaowxbg0e3/menu%20bouton%20accueil%20survol.png'" alt="Accueil'" />
    <area title="Une Blonde et Blogger" shape="rect" coords="128,27,245,94" href="http://uneblondeet-blogger.blogspot.fr/" onmouseover="document.Menu.src='https://photos-4.dropbox.com/s/f9khuaph4qqhnk3/menu%20bouton%20blonde%20survol.png'" onmouseout="document.Menu.src="https://photos-4.dropbox.com/s/mpmuozbm5zaaj6j/base%20onglets%20translucides%20koba%c3%af%20crash%20test%20gelly%20texte.png'" 
    Onclick="document.Menu.src='https://photos-4.dropbox.com/s/f9khuaph4qqhnk3/menu%20bouton%20blonde%20survol.png'" alt="Une Blonde et Blogger" />
    <area title="Onglet test" shape="rect" coords="255,27,369,94" href="http://kobai-uneblondeetblogger.blogspot.fr/p/un-onglet-test.html" onmouseover="document.Menu.src='https://photos-4.dropbox.com/s/7h3uglfwgxjk0uu/menu%20bouton%20onglet%203%20survol.png'" onmouseout="document.Menu.src="https://photos-4.dropbox.com/s/mpmuozbm5zaaj6j/base%20onglets%20translucides%20koba%c3%af%20crash%20test%20gelly%20texte.png'" 
    Onclick="document.Menu.src='https://photos-4.dropbox.com/s/7h3uglfwgxjk0uu/menu%20bouton%20onglet%203%20survol.png'" alt="Onglet test" />

    Sorry for the entire code, I've searched in it but didn't find this widget's code - ??

    (it's a HTML/Javascript widget in a Blogger blog.


    url of my "testing" blog:



    Thanks a lot by advance for your help!


    Trinita Girl