FreeCodeCamp - Wikipedia Viewer
How do I make an freecodecamp - wikipedia viewer?
What is a freecodecamp - wikipedia viewer? How do you make a freecodecamp - wikipedia viewer? This script and codes were developed by Jason Thomas on 14 September 2022, Wednesday.
FreeCodeCamp - Wikipedia Viewer - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>freeCodeCamp - Wikipedia Viewer</title> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css'>
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container"> <h2 class="text-center">Random Wikipedia Viewer </h2> <h4 class="text-center">A freeCodeCamp Project </h4> <div id="searching" class="text-center"><input type="text" id="searchBox"> <button type="submit" class="btn btn-primary" id="search_btn"><i class="fa fa-search" aria-hidden="true"></i></button> <div id="randomArticle" class="text-center"><a rel="nofollow" href="https://en.wikipedia.org/wiki/Special:Random" target="_blank">Click for a Random Page</a></div>
</div> <div id="results"> <div id="display-result"></div> </div>
</div> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js'></script> <script src="js/index.js"></script>
</body>
</html>
FreeCodeCamp - Wikipedia Viewer - Script Codes CSS Codes
.container { margin-top:30px;
}
body { background-image:url(https://dl.dropboxusercontent.com/s/ijvbmbe4kvmfi2n/white_sand.png?dl=0);
}
#randomArticle a:link, #randomArticle a:visited, #randomArticle a:hover, #randomArticle a:active { text-decoration:none; font-weight: bold; color: #404142;
}
#searching { padding-top: 30px;
}
#search_btn {
}
#display-result { margin-top:30px;
}
a.resultLinks:link, a.resultLinks:visited, a.resultLinks:hover { display:block; padding: 10px; margin-bottom: 20px; text-decoration: none; color: #292b2c;
}
a.resultLinks:link, a.resultLinks:visited { background-color:white;
}
a.resultLinks:hover { background-color:#ffa31a;
}
div.resultTitle { font-weight: bold;
}
FreeCodeCamp - Wikipedia Viewer - Script Codes JS Codes
$(document).ready(function(){ $('#searchBox').keypress(function(e){ if(e.keyCode==13) $('#search_btn').click(); });
});
$('#search_btn').click(function() { var search = $('#searchBox').val(); $.getJSON("https://en.wikipedia.org/w/api.php?format=json&action=query&generator=search&gsrnamespace=0&gsrlimit=10&prop=pageimages|extracts&pilimit=max&exintro&explaintext&exsentences=1&exlimit=max&gsrsearch=" + search + "&callback=?") .done(update) //.fail(handleErr);
});
function update(data) { $('#display-result').html(''); for(var key in data.query.pages) { var page = data.query.pages[key]; var wikiLink = page.title; wikiLink = "<a target ='blank' class='resultLinks' href='https://en.wikipedia.org/wiki/" + page.title.replace(" ", "_") + "'>"; $('#display-result').append(wikiLink + "<img src='" + page.thumbnail.source + "'>" + '<div class = "resultTitle">' + page.title + "</div>" + '<div class = "resultBlurb">' + page.extract + '</div>' + '</a>'); }
};
Developer | Jason Thomas |
Username | samoht513 |
Uploaded | September 14, 2022 |
Rating | 3 |
Size | 2,692 Kb |
Views | 20,240 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
FreeCodeCamp - Twitchtv API | 2,531 Kb |
FreeCodeCamp - Javascript Calculator | 1,907 Kb |
FreeCodeCamp - Personal Portfolio | 4,512 Kb |
FreeCodeCamp - Pomodoro Clock | 2,959 Kb |
Freecodecamp - Tribute Page | 3,583 Kb |
Html - canvas | 1,658 Kb |
FreeCodeCamp - Random Quote Generator | 3,218 Kb |
FreeCodeCamp - Tic Tac Toe Game | 2,820 Kb |
FreeCodeCamp - Local Weather App | 3,093 Kb |
FreeCodeCamp - Simon Game | 4,301 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
Jquery 2d character movement | Drewtadams | 4,291 Kb |
CSSOff 2013 Submission | Codewunder | 14,766 Kb |
Funny menu | AxeLVaisper | 4,671 Kb |
Ghost | Mghayour | 11,738 Kb |
Firefox Breakout Guide | Quincysoeliman | 2,576 Kb |
Learning FlexBox | Alex_rodrigues | 2,821 Kb |
A Pen by Alexandru Pora | Axpro | 1,615 Kb |
Part 19 Bootstrap split button dropdown | Venkatesha | 1,601 Kb |
Material design buttons | Fischaela | 4,381 Kb |
Retina canvas w. resize | Erikterwan | 1,882 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!