|
HTML - Wp Plugin Fancybox And Prettyphoto
I will try to keep this short.
Im thinking about converting my htmlsite to a WP site, but I'm experiencing some issues. Now I have 2 sections in my portfolio: PHOTOGRAPHY | WEBDESIGN. I currently use PrettyPhoto which i I love as you can choose to display smaller thumbnails at the bottom of the img you're already viewing, which makes browsing quicker as you dont have to flicker through EVERY image, but it allows you to choose which img you'd like to see in a bigger size: sample > http://img833.imageshack.us/img833/6071/sam001.jpg The only problem is, prettyPhoto works wonders when I need to display ONLY an image and maybe one or two lines of text. But for my WEBDESIGN portfolio I want to display much more, like a paragraph of text. I found a wonderful example where they display a small screencap of the website in the left part of the "fancybox popup" and a few lines of text and links in the right side of the "fancyboxpopup": http://www.gouramidesign.com/portfolio.aspx#webdesign Now my question is, how do I proceed? I do love prettyPhoto because of the smaller thumbnails at the bottom, but I also love the option to include img AND content with fancybox, so my questions would be as follows: - Is prettyPhoto customizable so I can add content similar to how fancybox displays it? - Is fancybox customizable so I can enable small clickable thumbnails? (I doubt this, have not seen it yet) - If necessary, I will use prettyPhoto for my photography and graphic art and fancybox for my webdesign portfolio. ATM im trying to install fancybox at wordpress but it's not really working out. Would really appreciate some help! Similar TutorialsHey guys. I have been playing with building a website for a b and b (figured it would give me calender plugins and a gallery to learn) which has been going well until recently. I have found a gallery plugin from TN3 that i really like, i downloaded it and have it working fine but for some reason it has messed up my formatting stretching a column more than i want and i have no idea how to fix it (the original page layout was form a free template and im new to CSS as last time i played with html was right at the start of CSS years ago). The page in question is: http://geekstest.web44.net/html/Gall...o/gallery.html Source is available, I can post the CSS in use if that is the source of the issue but i was hoping someone could take a quick look and guide me how i can fix the overscan on the right hand side? Thanks in advance; Andy Really simple stuff but im having problems getting my facebook plugin to align all the way to the right of my page. the website is www.beanaffiliatetoday.com. you can view the source code obviously so from there hopefully someone can telll me. im just starting out so im sorry. Thanks! I rececenlt made a Yahoo! SDK Plugin, but was rejected, these are the source files, with little playing around etc etc, later on. So it might (you'll notice), I'm not griping or anything (okay I am .....), but what's wrong with it. It works? Also its made with Html, no prgramming languages. http://www.htmlforums.com/attachment...1&d=1177633699 http://www.megaupload.com/?d=O55DJ062 my email is: pankaja.nityananda@gmail.com Hello all, First of all, I am new to HTML stuff, so any help would be really appreciated. I use a WYSIWYG program called WYSIWYG Web Builder. While using this program (for around 10 months) I learned some stuff about HTML, PHP and CSS. And I managed to make my own website very well. In my website, there are some pages that I would like visitors to comment on the article these pages contain. That program offers a "Blog Extension", all I needed to do is to drag this extension to the page and it automatically creates the PHP code and other stuff (of course after creating the SQL database). This extension shows the comments in an inline frame, but with the help of a guy who uses the same program, we managed to remove the inline frame, so with every comment added, the page height expands. The only downside of this blog extension is that anyone can comment without approving the comment by the admin! Now, I noticed that Facebook has a comment plugin, I tried it on a "white" page and it works well. But, let's have this scenario: I have a page with blue background color, and I want the Facebook comments plugin to be inside a gray frame that expands WITHOUT showing the scrollbar (not for the page, for the comments) when more comments are posted, how can I do that? Thanks a lot I created a wordpress blog using the Equilibrium template. Unfortunately the PagNav is not working and despite numerous requests to the creator, there is no solution. Any ideas ? I have a jQuery plugin on my website called Facebox and it for some apparent reason when the div opens up in a small pop up window like Facebook it shows my background image of my content div. I have been working all day trying to fix this issue. When I take out the background-image from "content" div i dont have this problem but I need my content background-image to stay where it currently is. Here is the code and an example... anyone know how I can fix this? Thank HTML Code: <div class="content">
<p> <a href="#info" rel="facebox">View the 'info' div in the Facebox</a> </p>
<div id="info" style="display:none;">
<p>Hey, I'm the 'info' div!
I look like this:</p>
</div>
</div
CSS FOR CONTENT DIV IN A SEPERATE STYLESHEET FROM FACEBOX CSS Code: .content {
width: 640px;
margin-right: auto;
margin-left: auto;
background-image: url(../images/_backgrounds/homepage_content.jpg);
background-repeat: no-repeat;
position:relative
}
CSS FOR FACEBOX PLUGIN Code: #facebox .b {
background:url(/facebox/b.png);
}
#facebox .tl {
background:url(/facebox/tl.png);
}
#facebox .tr {
background:url(/facebox/tr.png);
}
#facebox .bl {
background:url(/facebox/bl.png);
}
#facebox .br {
background:url(/facebox/br.png);
}
#facebox {
position: absolute;
top: 0;
left: 0;
z-index: 100;
text-align: left;
}
#facebox .popup {
position: relative;
}
#facebox table {
border-collapse: collapse;
}
#facebox td {
border-bottom: 0;
padding: 0;
}
#facebox .body {
padding: 10px;
background: #fff;
width: 370px;
}
#facebox .loading {
text-align: center;
}
#facebox .image {
text-align: center;
}
#facebox img {
border: 0;
margin: 0;
}
#facebox .footer {
border-top: 1px solid #DDDDDD;
padding-top: 5px;
margin-top: 10px;
text-align: right;
}
#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
height: 10px;
width: 10px;
overflow: hidden;
padding: 0;
}
#facebox_overlay {
position: fixed;
top: 0px;
left: 0px;
height:100%;
width:100%;
}
.facebox_hide {
z-index:-100;
}
.facebox_overlayBG {
background-color: #000;
z-index: 99;
}
* html #facebox_overlay { /* ie6 hack */
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
|
|||||||