Sưu tầm

http://community.composite.net/Blog/2011/01/25/Listdetail-views-with-MVC-3-and-AJAX In my quest to master Razor I tried to get a list/detail view up and running spiced up with a dash of AJAX and it turned out to be surprisingly easy – the code needed is available below. I used the OmniCorp demo site for this spike and the code is using the 'News' data type from that site – if you want to duplicate this behavior you should update the name space references to 'Omnicorp.Content' and the 'News' type and it's fields. Here are the steps needed to replicate this sample: Set up a OmniCorp demo site and install the MvcPlayer – this process is described in a previous blog post. Copy in the controller class below (to your ~/App_Code folder) Create the folder ~/Views/News and copy in the two views shown below. Add an instance of the MvcPlayer function to a page and specify "/News" as path – save, publish and browse to your test page to

http://www.w3schools.com/html/html_colors.asp Color Values CSS colors are defined using a hexadecimal (hex) notation for the combination of Red, Green, and Blue color values (RGB). The lowest value that can be given to one of the light sources is 0 (hex 00). The highest value is 255 (hex FF). Hex values are written as 3 double digit numbers, starting with a # sign. Color Examples Color Color HEX Color RGB   #000000 rgb(0,0,0)   #FF0000 rgb(255,0,0)   #00FF00 rgb(0,255,0)   #0000FF rgb(0,0,255)   #FFFF00 rgb(255,255,0)   #00FFFF rgb(0,255,255)   #FF00FF rgb(255,0,255)   #C0C0C0 rgb(192,192,192)   #FFFFFF rgb(255,255,255) Try it yourself » 16 Million Different Colors The combination of Red, Green and Blue values from 0 to 255 gives a total of more than 16 million different co

Today we’re going to build some simple jQuery image hover captions. These types of captions work very well in a variety of grid formats – portfolio work, feature boxes, blog displays, etc. From a UX perspective they attract user attention [with images] and then display additional content on hover. Let’s get started! The HTML We’ll create a standard container and then child .block divs inside. The .block divs will contain the images and child .caption divs that contain the caption content. <div class = "grid-block-container" >   <div class = "grid-block standard" > <div class = "caption" > <h3> Caption Title </h3> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> <p><a href = "#" class = "learn-more" > Learn more </a></p>

Depends. If the image is a link too, easy: HTML: <a href="somewhere.com"><img src="beeld.gif" alt="somewhere.com" title="click here to go to somewhere.com" /></a> In Internet Exploder, the ALT text shows on hover, which it's not supposed to but oh well. The rest of the world shows TITLE text on hover. However, if you want text to appear when hovering over just anything, that's a whole other clue of yarn. http://mikecherim.com/experiments/css_map_pop.php I used it on a website here: pizzaatje.nl > click on the scooter image at right, hover mouse over question marks. (earlier it was a three-page steaming pile of Javascript... now it's a few CSS rules) Ah, there is a third way I'd forgotten about. You could have the text already under the image (or above... wherever), but hidden by having the same colour as the background (the colour around the image). On hover

Mouse Here To Show Image <script language="Javascript"> <!-- function ShowPicture(id,Source) { if (Source=="1"){ if (document.layers) document.layers[''+id+''].visibility = "show" else if (document.all) document.all[''+id+''].style.visibility = "visible" else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "visible" } else if (Source=="0"){ if (document.layers) document.layers[''+id+''].visibility = "hide" else if (document.all) document.all[''+id+''].style.visibility = "hidden" else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "hidden" } } //--> </script> <style type="text/css"> #Style { position:absolute; visibility:hidden; border:solid 1

Thanks to CSS3 and better and better browser support for it, we can accomplish things now with CSS that previously required fancy JavaScript work. In this tutorial, I’ll walk you through fading in text over an image on hover. Tutorial Updated I updated this tutorial to show you how to take advantage of even more CSS3 properties. The update is available here . Here’s a sample of what we’ll be creating: Mt. Arenal, Costa Rica Venice, Italy La Jolla, California If you move your mouse over those images, you’ll see some text fade in that tells you where each photo was taken. When you move your mouse away, the text fades away. Nice, right? And look ma, no JavaScript. So let’s get started. Step 1: HTML Markup To keep things neat and tidy, I’m going to put my images in a list. Each list item will contain an image and a couple of nested <span> ‘s to hold the text that should appear when my site visitors hover over the images. Then I’ll wrap all of that in a link.

CSS hover effects CSS hover effects gives us the ability to animate changes to a CSS property value. In the following lesson we are going to follow that up with different kinds of effects specifically built for use with images. However, these effects can make your site feel much more dynamic and alive. The effects we will be using today all use code that is supported by modern browsers. Simple Hover Effects - See more at: http://www.corelangs.com/css/box/hover.html#sthash.LW7nVniD.dpuf