Results 1 to 2 of 2

Thread: Rotating Different Texts -- Same Function

  1. #1
    Join Date
    May 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Rotating Different Texts -- Same Function

    First, many thanks in advance for any help I will receive. You are coding gods.
    I have seen the same functions used for multiple values using this.index setThisText = _setThisText, etc. However, I can't understand how to apply this to the script below.
    I would like the first button to rotate the following text. I would then like the second button to rotate the text after that.
    I do not want to have multiple functions that do the same thing.

    <html>
    <title>Ren's Multiple Text Rotater</title>
    <head>
    <script>
    function changeText()
    {
    oldHTML = document.getElementById('para').innerHTML ;
    newHTML = "<b style='-moz-transform:rotate(90deg)'>" + oldHTML + "</b>" ;
    document.getElementById('para').innerHTML = newHTML ;
    }
    </script>
    </head>

    <body bgcolor= grey>

    <input onClick = changeText() type = button><b id = para>Rotate this text.</b>

    <p>

    <input onClick = changeText() type = button><b id = para>Rotate this other text.</b>

    </body>

    </html>

  2. #2
    Join Date
    Jul 2008
    Posts
    128
    Thanks
    0
    Thanked 17 Times in 16 Posts

    Default

    That function creates additional levels of nested elements each time it is run.
    Code:
    <html>
    <title>Multiple Text Rotator</title>
    <head>
    <script>
    
    function changeText( id )
    {
     var rStyle = '-moz-transform: rotate(90deg);', 
         elem = document.getElementById( id ), 
         es = elem.style;   
    
     if( es.cssText.indexOf( rStyle ) == -1 )  
      es.cssText += ';' + rStyle; 
     else 
      es.cssText = es.cssText.replace( rStyle, "");  
    }
    
    </script>
    </head>
    
    <body bgcolor= '#cccccc'>
    
    <input onclick = changeText('para') type = button><b id = 'para'>Rotate this text.</b>
    
    <p>
    
    <input onclick = changeText('para2') type = button><b id = 'para2'>This will work only on Mozilla.</b>
    
    </body>
    
    </html>
    You're welcome in advance.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •