XOOPS 
Forum
Forum Index General Forums Community Support Modules Support Themes Support Development International Support Module Hack Reviews Theme Designer Talk
  1. Board index / 
  2. XOOPS Community Support forums / 
  3. Beginner's Corner 
  4.  / fade in fade out text
Register
1
xuanyuu
fade in fade out text

  • 2010/3/24 3:11

  • xuanyuu

  • Just popping in

  • Posts: 53

  • Since: 2009/8/15


dear guys,
would like to request for help on how do i make the text in the block fade in and fade out?

btw, what theme is this XOOPS web using?

thank you.
2
mboyden
Re: fade in fade out text

  • 2010/3/24 3:35

  • mboyden

  • Moderator

  • Posts: 484

  • Since: 2005/3/9 1


Your best bet for fades and such is to use jQuery. XOOPS has standardized on jQuery. However, you can also setup your themes to use any of the other frameworks and there are lots of plugins, addins, or widgets that will do text fades and such; just put the HTML/j-script code into your templates.
3
xuanyuu
Re: fade in fade out text

  • 2010/3/24 4:34

  • xuanyuu

  • Just popping in

  • Posts: 53

  • Since: 2009/8/15


do u mind to tell me how do i edit my theme? i am using blue-lagoon. btw is there anywhere i can learn how to make my own theme?
thank you.
4
mboyden
Re: fade in fade out text

  • 2010/3/24 13:11

  • mboyden

  • Moderator

  • Posts: 484

  • Since: 2005/3/9 1


FAQs are your friend:

FAQs on Themes should help you find your answer and get started. When I started building my own years back, I started by looking at and editing others, starting with simple ones first and then looking at the more versatile and programmatic ones like Morphogenesis. It's not hard, but there is some to learn. Try it out and then ask specific questions that can't be answered by searching the XOOPS site forums and FAQs.

Good luck
5
kaotik
Re: fade in fade out text

  • 2010/3/24 16:52

  • kaotik

  • Just can't stay away

  • Posts: 861

  • Since: 2004/2/19


Code to fadein a div that contains text:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    <script type="text/javascript">
    $(document).ready(function(){
    $('#book').hide(); //Initially hide the div
$('#clickme').click(function() { //If click occurs process what's inside
      $('#book').fadeIn('slow', function() { // Do a fade in
        // You can perform aditional actions on fade in by placing code here
      }); //END FADEIN
    }); //END CLICK
   }); //END READY
    </script>
    
    <div id="clickme">
    <a href="#">Click here</a>
    </div>
    
    <div id="book">Hello World!</div>
6
kaotik
Re: fade in fade out text

  • 2010/3/24 16:55

  • kaotik

  • Just can't stay away

  • Posts: 861

  • Since: 2004/2/19


If you want to learn more about jquery, do a search on XOOPS news for "jquery tutorials"
7
kaotik
Re: fade in fade out text

  • 2010/3/24 17:03

  • kaotik

  • Just can't stay away

  • Posts: 861

  • Since: 2004/2/19


Now using jquery .toggle().
This alternates between 2 actions, in this case fadeIn and fadeOut.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    <script type="text/javascript">
    $(document).ready(function(){
    $('#book2').hide(); //Initially hide the div
    
    $('#clickme2').toggle(function() {
      $('#book2').fadeIn('slow', function() { }); //END FADEIN
}, function() {
      $('#book2').fadeOut('slow', function() { }); //END FADEOUT
});// END TOGGLE
    
   }); //END READY
    </script>
    
        <div id="clickme2">
    <a href="#">Click here for toggle</a>
    </div>   
    <div id="book2">Toggle is very cool!</div>
8
xuanyuu
Re: fade in fade out text

  • 2010/3/25 0:11

  • xuanyuu

  • Just popping in

  • Posts: 53

  • Since: 2009/8/15


ok guys, i will do what had u guys advised. thank you.. and will get back the result here after i try.

just another question, i downloaded a new XOOPS theme(Standards themes, compatibles with XOOPS 2.0.14+), but i tried with my XOOPS 2.0.16, it won't work on it, so how do i make this theme compatible with my old xoops?

thank you.

Login

Register now!  |  Lost Password?

Search

Advanced Search

Recent Posts

Who's Online

183 user(s) are online (121 user(s) are browsing Support Forums)

Members: 0

Guests: 183

more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: Apr 30
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits