I went to many sites, tried all they had, from ajax to javascript, jquery and there is not even one pop up that could be simple. Most of them have effects and screen background with a color, nothing of that please.
- need is a simple pop up box that contains text and images,just next to the link text with no effects, no screen background color.
- Using text as a button (for example>> "Read More"
Just to give more of an idea, you'll find an image example.
Here is the code of the " read more " text that is supposed to be the button.
<a href="#"><p style="color: #282828 ;">Read More...</p></a>
I would deeply appreciate if someone can help me.Please
I went to many sites, tried all they had, from ajax to javascript, jquery and there is not even one pop up that could be simple. Most of them have effects and screen background with a color, nothing of that please.
- need is a simple pop up box that contains text and images,just next to the link text with no effects, no screen background color.
- Using text as a button (for example>> "Read More"
Just to give more of an idea, you'll find an image example.
Here is the code of the " read more " text that is supposed to be the button.
<a href="#"><p style="color: #282828 ;">Read More...</p></a>
I would deeply appreciate if someone can help me.Please
Share Improve this question edited Feb 11, 2014 at 16:54 Sol asked Jan 10, 2014 at 23:04 SolSol 1951 gold badge4 silver badges14 bronze badges 1- If you don't like the plugins, than make a custom pop-up. Hidden div that shows on click...no effects and your own css...can't be more simple than that. – drip Commented Jan 10, 2014 at 23:17
1 Answer
Reset to default 2Have you checked the site below
jQuery UI
Add this kind of code to add a click on your Read Me...
Add to Read Me..
<a href="#" id="read_more_id_goes_here"><p style="color: #282828 ;">Read More...</p></a>
Then somewhere in the page I'd add this right where the example code is where stylesheet code ends. (Removing the example code for opening the dialog. and replacing it with this below)
<script>
$( "#read_more_id_goes_here" ).click(function() {
$( "#dialog" ).dialog();
});
</script>
Code for first example (seems what you need)
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery./ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery./jquery-1.9.1.js"></script>
<script src="http://code.jquery./ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( "#dialog" ).dialog();
});
</script>
</head>
<body>
<div id="dialog" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
</body>
</html>
CSS style.css File:
#dialog {
display: none;
}
.ui-dialog-title, .ui-dialog-content, .ui-widget-content {
font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
font-size: 62.5%;
}
Demo:
http://jsfiddle/Q9qt3/12/
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745274564a4619957.html
评论列表（0条）