How to create html pictures effects code?

Asked By 20 points N/A Posted on -
qa-featured

Hello friends,

How to create html pictures effects code? I want a blinking picture for my website html project to be submitted next week. Can you illustrate some coding technique or any video tutorials will do for me to get this done immediately.

Thanks and Regards,

Debra Carter.

SHARE
Best Answer by mcbrel
Go To Solution
Answered By 5 points N/A #172185

How to create html pictures effects code?

qa-featured

 

Hi
You can blink the image in html by writing image src code in between <blink> </blink> tag, But this tag doesn’t work properly with some browser like Internet Explore etc.
For Ex: <blink> <img src = "C:UsersVishalDocuments386300.jpg" alt = "poetry" width = "300" height = "50" align = "right"> </blink> but it doesn't work with Internet Explore that why you have to use a java script code in your html code. I am giving you the small script. just copy it and paste in your html page.
 
Script:
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
/*JavaScript*/
delay=100;
timer=window.setInterval("blinkImg()",1000);
function blinkImg()
{
f=document.getElementById("fire");
(a) f.style.display="block";
for(i=1;i<delay;i++) // creates delay between blinks
   dummy=0;
(b) f.style.display="none";
}
/*CSS*/
#fire{
position:absolute;top:140px;left:100px;
display:none;
}
</script>
</head>
<body>
<img src="images/fire.png" id="fire" /><br>
</body>
</html>
 
This code works fine. I hope this will help you.
About JOY Schilling
Questions
1
Answers
100
Best Answers
28
Best Answer
Best Answer
Answered By 0 points N/A #172186

How to create html pictures effects code?

qa-featured

Hi Debra Carter, 

I don`t know the code for a blinking image. But this is the code for a slideshow image in HTML.

If you want to try, this is the code. 

<html>

<head>

<script language="JavaScript">

<!–

var image1=new Image()

image1.src="image1.jpg"

 

var image2=new Image()

image2.src="image2.jpg"

 

var image3=new Image()

image3.src="image3.jpg"

//–>

</script>

</head>

<body>

<img src="image1.jpg" name="slide" width=150 height=150>

<script>

<!–

var step=1

function slideit(){

if (!document.images>

return

document.images.slide.src=eval("image"+step+".src")

if (step<3)

step++

else

step=1

setTimeout ("slideit()",1500)

}

slideit()

//–>

</script>

</body>

</html>

NOTE: All image should be the same size.

Just copy the code then paste it on notepad. Don`t forget to change the BOLD one`s.

You can add more image, for next image(4th image) just add

var image4=new Image()

image4.src="image4.jpg"

then change 3 in (step<3) to the number of your image in your slideshow.

the last one, change 1500 in ("slideit()",1500) to amount of time you want to go to the next image.(in milliseconds 1500=1.5 secs.)  

Hope this helps.

Good luck!

About mcbrel
Questions
0
Answers
3
Best Answers
1

How to attain a best fastest php file upload?

Previous

There is a problem with my download color computer keyboard.

Next

Related Questions