mmmartin123456

May 17, 2014

i m try change background <div> element ... better say only style...

i still dont read all tutorial... but was say javascript can only change elements what exist...

i try make something like this http://www.animedreaming.tv/ some small picture and if mouse at it.. change background

HTML

<div id="javaefects"><div id="icone"><img id="logo_1" class="logo" onmouseover="changeImage1()" src="pictureicone bro.png" alt="icone bro"><img id="logo_2" class="logo" onmouseover="changeImage2()" src="pictureicone sister.png" alt="icone sister"><img id="logo_3" class="logo" onmouseover="changeImage3()" src="pictureicone princes.png" alt="icone princes"><img id="logo_4" class="logo" onmouseover="changeImage4()" src="pictureicone ted.png" alt="icone ted"></div></div>

java

function changeImage1() {   	var element = document.getElementById('javaefects');	//element.background:url('picture/bro.png');	element.innerHTML = "THIS IS SPARTA";}

CSS

#javaefects{background:url('picture/no game no life.jpg');background-size:564px 250px;width:564px;height:250px;}

with experiments, i know java rewrite all element and keep only setting what is use at CSS setting, i m use for image css setting and need change only line background:url('picture/no game no life.jpg');

QUESTEN1: can javascript enter at CSS file ???

i was see some example change properity like:

image.src = "pic_bulbon.gif";

image.width="100"

image.height="180"

QUESTEN2: is posible change HTML background properity only ??? but keep others with CSS like: background-size:564px 250px;

May 16, 2014

i testing layout make...

for now in my opinion are 2 case

make for universal DISPLEY RESOLUTION with auto change "width" value %

second way is make like fixed value body {width:1000px} and math conting ... value PX

HTML

<!DOCTYPE html><html><head><meta charset="UTF-8" /><!-- 		-->	<meta http-equiv="refresh" content="5" /> 		<link rel="stylesheet" type="text/css" href="styles.css" /><script src="Javascripts.js"></script><title>AnimeFan.wz.sk</title><meta name="keywords" content="animefan" /><meta name="description" content="animefan" /><meta name="author" content="mmmartin123456" /></head><body><header><div class="left"><p id="demo">A Paragraph.</p><button type="button" onclick="myFunction()">Try it</button></div><div class="midle"><p>Anime Fan Wellcome ALL</p></div><div class="clear"></div></header><div class="clear"></div><nav><a class="bar" href="sub.html">Home</a><a class="bar" href="#">News</a><a class="bar" href="#">Contact</a><a class="bar" href="#">About</a><div class="clear"></div></nav><section><div class="clear"></div><p id="testbar_1">ANIME LIST</p><ul class="list"><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li></ul></section><article><div class="clear"></div><div id="javaefects"><a href="#"><img src="pictureno game no life-4.jpg" alt="NO GAME NO LIFE"></a></div><div id="text"><h1>ARTICLE</h1><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsdasdsadasdsadadsdasdsadasdsadadsdasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p><p>This is a paragraph11safasfasfasdsadsadasdsadasdsadadsadsadadsadsad1.</p></div><div><br /><br /><br /><br /><p>This is a paragraph11safasfasfasdsadsadas<br />dsadasdsadadsadsadadsadsad1.</p></div></article><aside><div class="clear"></div><h1>CSS example!</h1><p>This is a paragraph222.</p></aside><div class="clear"></div><footer><h1>This web started:</h1><p>8.5 2014</p></footer></body></html>

CSS

body {margin-left:13%;margin-right:13%;/*width-max:1000px*//*margin:auto;*//*width:1000px;*/			/*width:80%;*/background:#470000 url("girl.jpg") no-repeat fixed center top;		/*SHORTCUT*//*background-color:#ffffff;background-image:url("paper.jpg");background-repeat:no-repeat;background-attachment:fixed;background-position:center top; */}p{color:blue;margin-left:2%;}h1{color:black;}div.clear{clear:both;}header,section,article,aside,footer,div.body{background: -webkit-linear-gradient(left top, red,orange,yellow);  /*duha*/background: -o-linear-gradient(left top, red,orange,yellow);background: -moz-linear-gradient(left top, red,orange,yellow);background: linear-gradient(left top, red,orange,yellow);border:1px solid gray;margin:15px 0% 15px 0%;padding:0% 0% 0% 0%;}header{width:100%;/*height:50px;*/}div.left{width:33%;float:left;}div.midle{width:33%;float:left;text-shadow:2px 2px #FFFFFF;}div.midle p{text-align:center;padding:0px 0px 0px 0px;color:black;font-size:1.5em;}nav{/*margin-left:15px;*/}a.bar 					/*GLOBAL BAR*/{float:left;		/*ALLOW USE width*/width:24.8%;	border:1px solid gray;						text-align:center;}a.bar:link,a.bar:visited		/*NORMAL LINK SEE*/{color:#FF0000;			/*number #B2FF99 ,name red , ........*/text-decoration:none;		/*none, underline, ........*/background-color:#dddddd;	/*number #B2FF99 ,name red , ........*/}				/*font-family:monospace; ........*/a.bar:hover				/*WHEN MOVY WITH MOUSE AT*/{color:#FF0000;text-decoration:none;	background-color:#B2FF99;}a.bar:active 				/*AFTER CLICK AT LINK*/{color:#FF0000;text-decoration:none;	background-color:#B2FF99;}section,article,aside{width:20%;	overflow:hidden;float:left;/*display:block;*/	}#testbar_1{margin-left:0px;text-align:center;padding:5px 0px 0px 0px;color:black;}ul.list li{margin:0px 40px 3px 0px;list-style-type:none;/*;*/background-color:#ffffff;text-align:center;}a.bar_1{text-decoration:none;color:black;}a.bar_1:link,a.bar_1:visited		{text-decoration:none;color:black;}				a.bar_1:hover				/*WHEN MOVY WITH MOUSE AT*/{text-decoration:underline;color:#FF0000;}article{margin:15px 15px 0px 15px;padding:0px 0px 0px 0px;	width:564px;}#javaefects{margin:0px;/*padding:2px;*/width:474px;height:240px;}#javaefects img {/*outline-style:dotted;*/border:10px solid gray;width:544px;height:250px;}#text{margin:40px 15px 15px 15px;padding:0px 10px 0px 0px;height:300px;overflow-y:scroll;word-break:break-all;}aside{float:left;}footer{/*clear:both;*/}

at CSS look line

a.bar

{

width:24.8%;

border:1px solid gray;

}

here border cant make with value % .... value PX is diferent at DISPLEY RESOLUTION

so is 2000x768 or 1366x768 or 1024x768 is diferent in number pixels mean border take other value space in web

May 16, 2014

zoom can change size when are fixed add ???

i make config like

body {margin:auto;width:1000px;}header,section,article,aside,footer,div.body{border:1px solid gray;margin:15px 0px 15px 0px;padding:0px 0px 0px 0px;}section,article,aside{width:200px;overflow:hidden;float:left;}article{margin:15px 15px 0px 15px;padding:0px 0px 0px 0px;width:564px;}

it make like 1000px is MAX 2x200 + 1x564 + left and right margin 15 15 (30) + all have border 1... (1+1) x 3 = 1000

my web looking like corect...

http://postimg.org/image/4ijbdb4mj/

but if use zoom...

http://postimg.org/image/9ldggml99/

http://postimg.org/image/u7eddu01x/

http://postimg.org/image/5cuf04iur/

why it change posicion ?

section,article,aside are midle... and if zoom aside change posicion

May 16, 2014

i have problem make web size...

if make fixed value like

body {width:1000px}

it make bad if someone have DISPLEY RESOLUTION under 1000...

so solution for it make value with % ... instant px

body

{

margin-left:13%;

margin-right:13%;

}

with this make my body like center and make for others ELEMENTS BLOCK corect width

but...

if want for some BLOCK add border it is like

shorthand border:1px solid gray;

i cant use value at %... and here i get problem if make PX value i get others posicions if use diferent DISPLEY RESOLUTION

1px at 1000xXXX is like 1% and 1px at 2000xXXX is diferent...

example

i make like some ... BAR PANEL with 5 buttons... and use width:19.9%; it make in end some space... 0,1 for border

whatever it dont make corect width not use 100%.. space... or take more like 100% and droped under button... like make second bar

a.bar 					{float:left;	width:19.8%;	border:1px solid gray;						text-align:center;color:#FF0000;		text-decoration:none;		background-color:#dddddd;	}

diferent DISPLEY RESOLUTION make diferent effect

is some way fixed it for corect ?? border:1px solid gray; here i cant use value %....

or some example some already make layout posicions with some ELEMENTS BLOCK ???

May 15, 2014

where i can use this ????

Or you can put quotes inside a string by using the escape character:

var answer = 'It's alright';

var answer = "He is called "Johnny"";

if it work too without and is corect displey

<p id="demo"></p><script>var carName1 = "Volvo XC60";var carName2 = 'Volvo XC60';var answer1 = "It's alright";var answer2 = "He is called 'Johnny'";var answer3 = 'He is called "Johnny"';document.getElementById("demo").innerHTML = carName1 + "<br>" + carName2 + "<br>" + answer1 + "<br>" + answer2 + "<br>" + answer3</script>

why is this in special charakters table code ?

' single quote " double quote

May 13, 2014

i was read about something <meta> is for search engine...

i use like this <meta name="description" content="animefan" />

but i cant find it in google :/

May 13, 2014

i make bar, at left side..

i was see somewhere example like this in tutorial for make BAR

<ul class="list"><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li><li><a class="bar_1" href="#">XXXXXXX</a></li></ul>

i was add style

ul.list li{margin-right:40px;margin-bottom:3px;list-style-type:none;/*;*/background-color:#ffffff;text-align:center;}a.bar_1{text-decoration:none;color:black;}a.bar_1:link,a.bar_1:visited		{text-decoration:none;color:black;}				a.bar_1:hover		{text-decoration:underline;color:#FF0000;}

when i use <ul> or <ol>

it add specials charater, i was make them off (list-style-type:none;)

i here have problem with CENTER LINKS when i was off specials charater, it dont off SPACE... mean: if use center it make with more space at LEFT side and less at RIGHT... i use <section> with padding:15px; for this block

how much space (pixels) take <ul> or <ol> effect (list-style-type:none;)at left side ??? is possible off too space ???

i was use this command margin-right:40px; for make center...

and second when i use LINKS i can setting 4 mode

link, visited, hover, active

are here some RULES

When setting the style for several link states, there are some order rules:

a:hover MUST come after a:link and a:visited
a:active MUST come after a:hover

http://www.w3schools.com/css/css_link.asp

if i define this like ... global all links it make like all others type will same ??? like down ???

a.bar_1 {} = a.bar_1:link, a.bar_1:visited, a.bar_1:hover, a.bar_1:active {}

will corect if delete style a.bar_1:link,a.bar_1:visited if have already a.bar_1 setted ?

May 13, 2014

yes work, thanks

May 13, 2014

hi

i want make like off all elements <div> and only few myself element keep i was make like

div{display:none;            /*it off all elements....*/}

and now i want few elements on

div.visible{display:XXXXXXXXXXX;}

i want off effect in all div.visible what properity can rewrite display:none; ??? or delete it ???

May 11, 2014

again me... i m try make some ... sematic WEB for elements...

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>ANIMEFAN</title><style>body {margin:auto;width:1000px; /*width:80%;*//*background-image:url("paper.jpg");background-repeat:no-repeat;*/}p {color:blue;margin-left:20px;}h1{color:RED;}header,nav,section,article,aside,footer,div.body{border:1px solid gray;margin:15px;padding:15px;}section{float:left;width:200px;}article{clear:both;}aside{}</style></head><body><header><h1>CSS example!</h1><p>This is a paragraph.</p></header><nav><h1>CSS example!</h1><p>This is a paragraph.</p></nav><div class="body"><section><h1>CSS example!</h1><p>This is a paragraph.</p><h1>CSS example!</h1><p>This is a paragraph.</p><h1>CSS example!</h1><p>This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.This is a paragraph.</p><h1>CSS example!</h1><p>This is a paragraph.</p><h1>CSS example!</h1><p>This is a paragraph.</p><h1>CSS example!</h1><p>This is a paragraph.</p><h1>CSS example!</h1><p>This is a paragraph.</p><h1>CSS example!</h1><p>This is a paragraph.</p></section><article><h1>CSS example!</h1><p>This is a paragraph.</p></article><aside><h1>CSS example!</h1><p>This is a paragraph.</p></aside></div><footer><h1>CSS example!</h1><p>This is a paragraph.</p></footer></body></html>

i was read about <div> is use for make web looking good ... later i see in HTML5 about use commands this...

what is diferent <div> and this others commands????

if i use this commands they are not support in some brosers ... dont is better use old way only with <div>????

i want help in code above with part <div class="body">

i want make like this

http://www.w3schools.com/html/img_sem_elements.gif

some folder at LEFT and orther 2 at RIGHT <article> and <aside> elements

in style are use other type comments before it was in file... like:

and about BODY STYLE

body {margin:auto;width:1000px; /*width:80%;*/}

width

what is better use ? SETTING VALUE or make it like auto with % for diferent ... Resolution like 1024x768 or 1366x768.... 800x600 and others

and about margin:auto; i was read some is not support for all broser

Note: Using margin:auto; will not work in IE8 and earlier, unless a !DOCTYPE is declared.

is it ok, keep margin for auto ??? or is some better way ?

and more one questen:

about:

i was testing something like this

body {margin:auto;width:1000px; /*width:80%;*/background-image:url("paper.jpg");background-repeat:no-repeat;background-position:center; }

in both way in FILE and in HTML in HEAD here was a bit diferent in posicion background ...

in HEAD AT HTML FILE was FULL PICTURE and IN FILE WAS CUTTING PICTURE A BIT... WITH TOP...

is here more diference in THIS 2 WAY ???? (in others commands (?))

about use background what is best way and where ? how make background in CSS without cutting picture ?

May 11, 2014

hi, in tutorial HTML5

HTML5 Form Attributes

http://www.w3schools.com/html/html5_form_attributes.asp

in example

autocomplete Attribute

http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_input_autocomplete

was write about will add value, what was before add ... i was try refresh and too button for again load example

but it dont add value (what i put before)... i use broser GOOGLE CHROME

in setting dont think i have off this effect...

how it work ?

and second thing, i was look this section

HTML5 Input Types

http://www.w3schools.com/html/html5_form_input_types.asp

and i was find strangle thing

Input Type: tel

The tel type is used for input fields that should contain a telephone number.

what doing this command ??? (when it dont is support for ANYONE BROSER ?????)

Sign In

mmmartin123456

Posts

Joined

Last visited

Content Type

Profiles

Forums

Events

Posts posted by mmmartin123456

script change background

layout webpage

zoom at page

layout webpage

Tutorial Strings

how make see page at google

LIST and LINKS

display Property

display Property

learn in tutorials

learn in tutorials

Browse

Activity