├── Bird.jpg ├── Ganesha.jpg ├── README.md ├── cat.jpeg ├── girl.jpg ├── index.html ├── krishna.webp ├── script.js ├── style.css └── wall.webp /Bird.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Manishak798/Image-Search-Engine/b7128cc90039213327984d1bb5dec65026800dd0/Bird.jpg -------------------------------------------------------------------------------- /Ganesha.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Manishak798/Image-Search-Engine/b7128cc90039213327984d1bb5dec65026800dd0/Ganesha.jpg -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Image-Search-Engine 2 | This repo contains a cool JavaScript project that is used for searching images via a search engine. 3 | # Tech Stack 4 | 9 | 10 | # Project Screenshot 11 | ![image](https://github.com/Manishak798/Image-Search-Engine/assets/90680330/88caaae2-22c5-47c3-932c-e5fe34091495) 12 | # Project URL 13 | Visit Site: https://manishak798.github.io/Image-Search-Engine/ 14 | -------------------------------------------------------------------------------- /cat.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Manishak798/Image-Search-Engine/b7128cc90039213327984d1bb5dec65026800dd0/cat.jpeg -------------------------------------------------------------------------------- /girl.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Manishak798/Image-Search-Engine/b7128cc90039213327984d1bb5dec65026800dd0/girl.jpg -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Image Search Engine 7 | 14 | 15 | 16 | 17 |
18 |

Search an Image, You Like!!🔎🕵🏻‍♂️

19 |
20 |
21 |
22 | 23 | 26 |
27 |
28 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /krishna.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Manishak798/Image-Search-Engine/b7128cc90039213327984d1bb5dec65026800dd0/krishna.webp -------------------------------------------------------------------------------- /script.js: -------------------------------------------------------------------------------- 1 | function searchImage(){ 2 | var a=document.getElementById("name").value; 3 | if(a=="bird"){ 4 | var x = document.createElement("IMG"); 5 | x.setAttribute("class","centr") 6 | x.setAttribute("src", "Bird.jpg"); 7 | x.setAttribute("width", "350"); 8 | x.setAttribute("height", "350"); 9 | x.setAttribute("alt", "The Pulpit Rock"); 10 | document.body.appendChild(x); 11 | } 12 | else if(a=="cat"){ 13 | var x = document.createElement("IMG"); 14 | x.setAttribute("class","centr") 15 | x.setAttribute("src", "cat.jpeg"); 16 | x.setAttribute("width", "350"); 17 | x.setAttribute("height", "350"); 18 | x.setAttribute("alt", "The Pulpit Rock"); 19 | document.body.appendChild(x); 20 | } 21 | else if(a=="ganesha"){ 22 | var x = document.createElement("IMG"); 23 | x.setAttribute("class","centr") 24 | x.setAttribute("src", "Ganesha.jpg"); 25 | x.setAttribute("width", "350"); 26 | x.setAttribute("height", "350"); 27 | x.setAttribute("alt", "The Pulpit Rock"); 28 | document.body.appendChild(x); 29 | } 30 | else if(a=="girl"){ 31 | var x = document.createElement("IMG"); 32 | x.setAttribute("class","centr") 33 | x.setAttribute("src", "girl.jpg"); 34 | x.setAttribute("width", "350"); 35 | x.setAttribute("height", "350"); 36 | x.setAttribute("alt", "The Pulpit Rock"); 37 | document.body.appendChild(x); 38 | } 39 | else if(a=="krishna"){ 40 | var x = document.createElement("IMG"); 41 | x.setAttribute("class","centr") 42 | x.setAttribute("src", "krishna.webp"); 43 | x.setAttribute("width", "350"); 44 | x.setAttribute("height", "350"); 45 | x.setAttribute("alt", "The Pulpit Rock"); 46 | document.body.appendChild(x); 47 | } 48 | else if(a=="wallpaper"){ 49 | var x = document.createElement("IMG"); 50 | x.setAttribute("class","centr") 51 | x.setAttribute("src", "wall.webp"); 52 | x.setAttribute("width", "350"); 53 | x.setAttribute("height", "350"); 54 | x.setAttribute("alt", "The Pulpit Rock"); 55 | document.body.appendChild(x); 56 | }else{ 57 | document.write("error!!"); 58 | } 59 | 60 | } -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | } 5 | body{ 6 | background-color: #FAF3F0; 7 | } 8 | h1{ 9 | color: #867070; 10 | } 11 | .head{ 12 | height: 100px; 13 | width: 100%; 14 | margin-top: 30px; 15 | padding: 20px 20px; 16 | } 17 | .head>h1{ 18 | margin-top: 25px; 19 | text-align: center; 20 | font-weight: 1000; 21 | font-size: 60px; 22 | } 23 | .search{ 24 | height: 100px; 25 | width: 100%; 26 | margin-top: 30px; 27 | 28 | } 29 | .search-box{ 30 | height: 80px; 31 | width: 100%; 32 | padding: 20px 20px; 33 | margin-left: 310px; 34 | } 35 | input{ 36 | width: 50%; 37 | height: 50px; 38 | border-radius: 10px; 39 | font-size: 30px; 40 | text-decoration: none; 41 | } 42 | input:focus::-webkit-input-placeholder{ 43 | opacity: 0;/*input placeholder text will disappear when user focus or click in input box*/ 44 | } 45 | button{ 46 | height: 55px; 47 | border-radius: 10px; 48 | font-size: 30px; 49 | width: 10%; 50 | } 51 | .centr{ 52 | margin-left: 450px; 53 | } -------------------------------------------------------------------------------- /wall.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Manishak798/Image-Search-Engine/b7128cc90039213327984d1bb5dec65026800dd0/wall.webp --------------------------------------------------------------------------------