Results 1 to 5 of 5

Thread: asking some question on webpage

  1. #1
    Join Date
    Dec 2007
    Location
    MY
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default asking some question on webpage

    I would like to ask is how to make it like a page will have effect. Im not sure how to say it, like when people visit the site, then enter into the page, then the page wil have effect like fade in or other thing, but I dun want to be done in full page, it just some part of it. Use what to done this? javascript? or other techniq?

    a good example is like the deathnote online(currently closed).

    SORY FOR MY BAD ENGLISH...

  2. #2
    Join Date
    May 2006
    Location
    Sydney, Australia - Near the coast.
    Posts
    1,995
    Thanks
    0
    Thanked 8 Times in 7 Posts

    Default

    Peter - alotofstuffhere[dot]com - Email Me - Donate via PayPal - Got spare hardware? Donate 'em to me :) Just send me a PM.
    Currently: enjoying the early holidays :)
    Read before posting: FAQ | What you CAN'T do with JavaScript | Form Rules | Thread Title Naming Guide

  3. #3
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,627
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    Are you looking for something like this:

    http://www.dynamicdrive.com/dynamici...adualfader.htm

    * The script can be customized for your purpose but tell us whether you are looking for this effect or not.

  4. #4
    Join Date
    Dec 2007
    Location
    MY
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    oh yeha, something like this, thx for help @codeexploiter & @tech_support

    btw, @codeexploiter,
    The function of the fader can have only once, i mean let say i press "Enter the page", then it fader to the next page... something like tat.

  5. #5
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,627
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    Have a look at the following code

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    	<head>
    		<title>DIV Opacity</title>
    		<style type="text/css">
    			#test{
    				zoom: 1;
    				width: 300px;
    				border:1px solid #000;
    				background-color: #c4c5c6;
    				padding: 5px;
    			}
    		</style>
    		<script type="text/javascript">
    			var testObj;
    			
    			function changeOpacity(){
    					testObj = document.getElementById('test');
    					for(var i= 0; i <11; i++){
    						setTimeout('setOpacity('+i+')',100*i);						
    					}
    			}
    			
    			function setOpacity(value){
    				testObj.style.opacity = value/10;
    				testObj.style.filter = 'alpha(opacity=' + value * 10 + ')';
    			}
    			
    			window.onload = function(){
    				document.getElementById('link').onclick = changeOpacity;
    			}
    		</script>
    	</head>
    	<body>
    		<p><a href="#" id="link">Test..</a></p>
    		<div id="test">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</div>
    	</body>
    </html>
    After loading the page in browser click the link 'Test..' and see how the fade-in operation performs on the div element placed just below the link. Then check the JS function setOpacity which changes the opacity of the DIV element.

    I've used a function which you can find in the following location with a good account about the processing'

    http://www.quirksmode.org/js/opacity.html

    Hope this helps

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
  •