Dynamic scrolling slideshow
Hi there I am creating a shop website
I am using DWCS3 and PHPMYSQL
I can already create all the product pages that can be
dynamically populated from a form...... I can add, edit and delete
products from my admin section of my site .... using a form ....
all easy using a database to store all the picture and product
details
What I would like to be able to do is have the pictures that
I upload to be automatically placed in a scrolling slideshow
So that when you add a new product ...... when you click on
the product detail page you see all the still pictures of the
product ( which I can already do) .......but have an animated
scrolling slideshow of the pictures as well
Is there a program that can achieve this? Without knowing a
lot of flash?
Or is it possible and necessary to create the whole system
using flash?
Any help would be great
Have a nice day
Hi, check out this add-on for DW. :
http://dmxzone.com/showDetail.asp?TypeId=3&NewsId=13984
Similar Messages
-
Dynamic Text Feild with Dynamic Scroll Bar
I have a Dynamic Text Feild with a dynamic Scroll bar.
It loads a simple ASCI text file with some html formating.
but I still can not manage to get the text to format.
The biggest problem with the format is a big space between
paragraphs.
I am not sure why but I think the Frame must need a var to
render to html.
Can anybody help please?My text had the following, similar but no parsing string.
I guess
yourstring.split("\n\r").join("\r").split("\r\n").join("\r");
takes out the carrage returns or <br>?
I notice the one I had just say's String.
I assume that would be the text that is the string?
Thank you for sharing your knowledge of this.
var my_lv:LoadVars = new LoadVars();
my_lv.onData = function(src:String) {
if (src != undefined) {
myTxtFeild.text = src;
} else {
myTxtFile.text = "Error loading text.";
my_lv.load("CadnetPage1_html.txt"); -
does anyone know or could give an advise how to create
"dynamicly scrolled content" in flash?
here are the examples:
http://kashiwasato.com
http://www.mamastudio.pl
the flash content of the window is repositioning according to
the window resize
thanks a lot for any help :)hi,
This code will set only 5 visible rows .
Bind the visiblerow count property of table with an attribute of type I.
Before binding the table with internal table write this code :
DESCRIBE TABLE t_selected_hcp LINES lv_visiblerow.
****** Reduce the no of visible rows *************
IF lv_visiblerow > 5.
lv_visiblerow = 5 .
ENDIF.
* navigate from <CONTEXT> to <CN_TABLEPROP> via lead selection
lo_nd_cn_tableprop = wd_context->get_child_node( name = wd_this->wdctx_cn_tableprop_pvl ).
get element via lead selection
lo_el_cn_tableprop = lo_nd_cn_tableprop->get_element( ).
IF lv_visiblerow > 0 .
get single attribute
lo_el_cn_tableprop->set_attribute(
name = `CA_VISIBLEROW_PVL`
value = lv_visiblerow ).
ELSEIF lv_visiblerow = 0 .
lo_el_cn_tableprop->set_attribute(
name = `CA_VISIBLEROW_PVL`
value = -1 ).
ENDIF.
This will make sure that only 5 rows are visible and rest you have to scroll to see.
Now if you want that out of 6 rows added to the table , last 5 rows should be visible then :
Create a Context Attribute of type I "LEAD_SELECTION" and bind this to firstVisibleRow property of table .
Write this code:
Get the number of rows in table ****
DESCRIBE TABLE it_selected_hcp1 LINES lv_count.
DATA lo_el_context TYPE REF TO if_wd_context_element.
Set the lead selection to last row *****
lo_el_context = wd_context->get_element( ).
lo_el_context->set_attribute( name = `LEAD_SELECTION` value = lv_count ).
lo_nd_cn_entertainment->set_lead_selection_index( lv_count ).
This will work.
Edited by: Saurav Mago on Oct 9, 2009 3:16 PM -
Dynamic scrolling heading muse
How would i create a dynamic scrolling heading similar to that off www.cnet.com where the header starts with a full sized logo but changes to a simple block format and stays locked at the top. I was considering using two different nag bars, the scrolling one under the main one but completely transparent and have them both set to scroll opacity so that the main one would disappear as you scroll and the smaller one would appear to replace it but I'm not too sure how to use that feature or even if it would work. I know it likely involves jQuery but I'm new to coding and web development so if anyone has an answer it would be greatly appreciated, thanks.
RodneytfHi
You can try using any composition or panel where you have to insert another object such as rectangles or menu items which would act on mouse click.
For example :
Insert composition/panel widget
In target container insert another object such as rectangle with hyperlink to specific pages with styles applied.
Thanks,
Sanjit -
Can't scroll slideshow in phone format.
I can't seem to scroll slideshows on my iphone. Is there any reason for this or is there something I'm doing wrong?
Dear Detlef,
This was very helpfull! The process flows and the mapping seems to run ok again! Only one thing left now. I use sql script to run the mappings which looks like that:
DECLARE
temp_ok INTEGER;
begin
temp_ok := owb_owner.WB_RT_API_EXEC.RUN_TASK('REP_USER_LOCATION', 'PLSQLMAP', 'DIAXEIRISTIKH_ARXH_MAP_K1', *'PAY_DAY=01/01/2008,'*, ',', 0, 1);
IF temp_ok = 2 THEN
RAISE_APPLICATION_ERROR(-20001, 'WARNING DURING EXECUTION OF THE MAPPING');
ELSIF temp_ok = 3 THEN
RAISE_APPLICATION_ERROR(-20002, 'ERROR DURING EXECUTION OF THE MAPPING');
END IF;
end;
The bold parameter is the input parameter of the mapping. I use PAY_DAY as varchar2 and then I use to_date() again.
It seems that this isn't the proper way to input a string cause it returns error. I used PAY_DAY='01/01/2008' or PAY_DAY="01/01/2008" or PAY_DAY=/'01/01/2008/' with no results.
Do you know something about that, or just a way to import a string?
thnx in advance,
Lex. -
Broad Question - Horizontal Scrolling Slideshow with Still Images
Hi everyone,
I have to make a horizontal scrolling slideshow using many images of different filetypes, sizes and DPI in Premiere Pro CS5.5. I have tried a few different methods but each has its own problems:
1. Arrange still images horizontally in the timeline, adjacent to eachother, and apply a custom Push video transition between each one. This is a consistent method that doesnt require much work but it's tough to control the amount of whitespace between the images, especially when the images are all different proportions.
2. Arrange still images both horizontally and vertically in the timeline, so that there is no white space between the images (the images overlap across multiple video lanes). Then, set up motion fx for the position of the image for each clip. This is tedious and I have to make every clip the same size and make sure the distance each clip travels (in the motion fx) is the same. So for instance, I have to set the starting key to 1200 on the x-axis, and the ending key to -300, for every single image (tedious when there are many). Another problem with this is that it becomes very difficult to change the duration of the motion fx once ive set it up for many.
3. To have an easier time composing the arrangement of images, I just make a single giant image by laying out dozens of photos in InDesign, then export a very wide jpeg. The great thing about this is it's fast, easy, and the composition is exactly how i want it. The bad thing is that premiere doesn't handle many megapixel images well, and furthermore the image quality is horrific compared to the quality of importing individual images.
The biggest problem with all of these is the image quality (extremely poor compared to viewing the source images on their own) and the animation smoothness (all three methods produce very jittery and erratic videos). The biggest question I have is: should I even be doing a slideshow in Premiere? Can someone recommend a better application I should be using for something like this? Do i have to learn Flash? I am not trying to make an interactive thing, just a video/animation where I hit play and dozens of images scroll horizontally, at the same speed, with a lot of control over the scaling of the images and their horizontal and vertical arrangement (the amount of whitespace between them).
Thanks for everyone's time and help!Don't know if it is still being sold, but Grass Valley's Imaginate was the perfect application for your intended purpose. There are many others as well, but PR is not the program of choice for this.
-
How do I add a 5th photo to be viewed in a scrolling slideshow while still keeping it 4 photos long?
I am not sure if this really makes sense. But I am working with a template in Dreamweaver and the template has a 4 picture vertical slideshow(attached photo). It is really not a slideshow but I do not know what else to call it. So I want to add more than just 4 pictures but everytime I go to add a picture it turns the 4 picture slideshow into a 5 picture slideshow rather than hiding that 5th picture until it is scrolled over using the up/down buttons at the bottom. Initially the Up/Down buttons are of no use unless I can figure this out and add say 8 pictures instead of just the 4. If now I will just have to remove the buttons since they would be a waste of place.
This is the html code used in the template for this slideshow. If you have any suggestions it would be greatly appreciated since I am sort of new to Dreamweaver. Also if you need more information I would be happy to provide you with anything.
<div class="images">
<ul>
<li><a href="#"><img src="images/yellow.gif" alt="" width="215" height="124"/></a></li>
<li><a href="#"><img src="images/basin_door.gif" alt="" width="215" height="124"/></a></li>
<li><a href="#"><img src="images/ford_valve_covers.gif" alt="" width="215" height="124"/></a></li>
<li><a href="#"><img src="images/car_frame.gif" alt="" width="215" height="124"/></a></li>
</ul>
</div>
Thank you,
RyanWell I tried placing that in various places. Under .images which stretched each image to 500px since that would equal the 4 images. But instead it stretched each image.
I placed in layout.css under the appropriate index which worked but once I tried to place another image it tried to just add it which eliminated the Up/Down buttons.
In other words I have no idea where to place this code plus it probably doesn't help that I am pretty new to dreamweaver. So I attached the layout.css, style.css, and index-3.html which is the page I am working with right now. Thank you.
Layout.css
/*======= index.html =======*/
#page1 header {height: 664px;}
#page1 .col-1 {width: 215px;}
#page1 .col-2 {width: 665px; padding: 0px 0px 0px 42px;}
#page1 .col-2 .col-1 {width: 287px;}
#page1 .divider {background: url(../images/divider-bg.gif) 247px 0px repeat-y;}
/*======= index-1.html =======*/
#page2 .col-1 {width: 242px;}
#page2 .col-2 {
width: 625px;
text-align: center;
#page2 .divider {background: url(../images/divider-bg.gif) 247px 0px repeat-y;}
/*======= index-2.html =======*/
#page3 .col-1 {width: 275px;}
#page3 .col-2 {width: 900px;}
#page3 .col-3 {width: 214px;}
//#page3 .divider {background: url(../images/divider-bg.gif) 652px 0px repeat-y;}
/*======= index-3.html =======*/
#page4 .col-1 {width: 215px;}
#page4 .col-2 {
width: 650px;
padding-left: 47px;
#page4 .col-2 .col-1 {width: 286px;}
#page4 .divider {background: url(../images/divider-bg.gif) 247px 0px repeat-y;}
/*======= index-4.html =======*/
#page5 .col-1 {width: 198px;}
#page5 .col-2 {width: 900px; padding: 0px 27px 0px 0px}
//#page5 .divider {background: url(../images/divider-bg.gif) 449px 0px repeat-y;}
/*======= index-5.html =======*/
#page6 .col-1 {width: 215px;}
#page6 .col-2 {
width: 620px;
padding-right: 63px;
#page6 .col-2 .col-1 {width: 286px;}
#page6 .divider {background: url(../images/divider-bg.gif) 652px 0px repeat-y;}
/*======= index-6.html =======*/
#page7 .col-1 {width: 242px;}
#page7 .col-2 {width: 620px;}
#page7 .divider {background: url(../images/divider-bg.gif) 247px 0px repeat-y;}
Style.css
/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }
/* Global properties ======================================================== */
body {
background: url(../images/policsy-bg.gif) 0 bottom repeat-x #fff;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 18px;
color: #828282;
min-width: 1000px;
html, body { height: 100%;}
p { padding-top: 18px; }
.top { padding-top: 6px; }
.top1 { padding-top: 0px; }
.top2 { padding-top: 0px; }
.top3 { padding-top: 21px; }
.top4 { padding-top: 25px; }
.top5 { padding-top: 29px; }
.bot { padding-bottom: 34px; }
.bot1 {
padding-bottom: 38px;
padding-left: 0px
.h-top {padding: 0px 0px 2px 0px; margin-top: -2px;}
.h-bot {
padding-bottom: 25px;
text-align: center;
padding-right: 0px;
.h-bot1 {
padding-bottom: 20px;
text-align: center;
.h-bot2 {padding-bottom: 3px;}
.h-bot3 {padding-bottom: 23px;}
.pad-left {
display: inline-block;
margin-left: 4px;
a { color: #d52d00; outline: none; }
a:hover{
text-decoration: none;
color: #B8D6D6;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
/* Global Structure ============================================================= */
.main {
margin: 0 auto;
width: 960px;
/* Header */
header{
height: 438px;
/* Content */
section#content {
/* Footer */
footer{
min-height: 268px;
/* Left & Right alignment */
.fleft { float: left;}
.fright { float: right;}
.clear { clear: both;}
.col-1, .col-2, .col-3, .col-4, .col-5 { float: left;}
.alignright { text-align: right;}
.aligncenter { text-align: center;}
.wrapper {
width: 100%;
overflow: hidden;
.container {
width: 100%;
/*----- form defaults -----*/
input, select, textarea {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
vertical-align: middle;
font-weight: normal;
/*----- other -----*/
.img-indent { margin: 0 25px 0 0; float: left; }
.extra-wrap { overflow: hidden; }
.img {padding-top: 4px;}
.img1 {padding-top: 2px;}
/*=============================================================================== text =====*/
h1 {
padding: 0px 0 0px 326px;
position: relative;
float: left;
h1 a {
display: block;
height: 120px;
width: 300px;
text-indent: -5000px;
background: url(../images/msi_logo_webcolors.gif) left top no-repeat;
h2 {
font-size: 24px;
line-height: 1.2em;
color: #fff;
padding: 36px 0px 2px 0px;
margin: 0px 0px 0px 0px;
text-align: center;
h3 {
font-size: 18px;
line-height: 1.2em;
color: #fff;
padding: 16px 0px 17px 0px;
.color {color: #19a7f4;}
/*======================================================================================== =========================== header =====*/
.extra {background: url(../images/body-bg.gif) 0 0 repeat-x #222222;}
.shadow {background: url(../images/extra-bg.jpg) top center no-repeat;}
.header strong {
float: left;
padding: 9px 0 0 0;
color: #333;
text-transform: uppercase;
text-decoration: none;
font-size: 12px;
line-height: 1.2em;
display: inline-block;
*+ html .header strong {
padding: 7px 0 0 0;
.login {
float: right;
padding: 4px 0 0 0;
margin-right: -2px;
width: 204px;
*+ html .login {
width: 201px;
.login-link {
background: url(../images/login-bg.gif) left 0px no-repeat;
padding: 4px 0 0 22px;
margin: 1px 0 0;
color: #a0a0a0;
text-transform: uppercase;
text-decoration: none;
font-size: 12px;
line-height: 1.2em;
display: inline-block;
*+ html .login-link {
padding: 2px 0 0 21px;
.login-link:hover {
color: #333;
.social {
float: right;
background: url(../images/login-span-bg.gif) 0 4px no-repeat;
padding-left: 0px;
overflow: hidden;
width: 92px;
margin-left: 7px;
.social img {
float: right;
margin-left: 4px;
/*=============================================================================== nav =====*/
#menu {
width: 100%;
height: 68px; position:relative; z-index:99
#menu > li {
float: left;
font-size: 15px;
line-height: 1.2em;
background: url(../images/nav-li-bg.png) 0 0 no-repeat;
padding-left: 2px; position:relative
#menu > li > a {
display: block;
width: 134px;
background: url(../images/nav-a-bg.png) 0 0 repeat-x;
text-align: center;
text-transform: uppercase;
text-decoration: none;
color: white;
padding: 28px 0 21px;
#menu > li:hover > a{ color:#1eaffa}
#menu > li > .active {
background: url(../images/nav-a-bg-hover.gif) 0 0 repeat-x;
position: relative;
margin-left: -2px;
padding: 28px 0 21px 2px;
color:#fff !important
#menu > .first{ background:none;
padding-left:0}
#menu > .first > a {
background: url(../images/nav-first-a-bg.gif) 0 0 no-repeat;
margin: 0;
width: 135px;
#menu > .first > .active {
background: url(../images/nav-first-a-bg-hover.gif) 0 0 no-repeat;
margin: 0 0px 0 0;
padding: 25px 0 24px 0px;
#menu > .last > a {
background: url(../images/nav-last-a-bg.gif) right 0 no-repeat;
margin: 0;
width: 143px;
#menu > .last > .active {
background: url(../images/nav-last-a-bg-hover.gif) right 0 no-repeat;
margin: 0 0px 0 -1px;
padding-left: 1px;
.submenu_1{ position:absolute; top:73px; left:0; width:295px;}
.menu_box{ padding:14px; background:#272727}
.menu_box > li{ line-height:36px; background: url(../images/menu_line.gif) 0 bottom repeat-x; position:relative; margin-top:-2px; padding:3px 0; zoom:1}
.menu_box > .end{ background: none}
.menu_box > li > a{ display:block; padding-left:19px;border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px; font-size:13px; font-weight:700; color:#fff; text-transform:uppercase; text-decoration:none; position:relative; line-height:36px; height:36px; zoom:1;background: url(../images/spacer.gif) 0 0 repeat}
.menu_box > li:hover > a{background: url(../images/submenu_bg.gif) 0 0 repeat-x #0280d8;}
.menu_box > li:hover{ background:#272727}
.submenu_2{ top:-13px; position:absolute; left:282px; width:181px; background:#272727}
.submenu_2 > ul{ padding:14px 9px}
.submenu_2 > ul >li{ line-height:40px; background: url(../images/menu_line.gif) 0 bottom repeat-x;}
.submenu_2 > ul >li > a{ display:block; padding-left:22px;font-size:13px; font-weight:700; color:#fff; text-transform:uppercase; text-decoration:none; line-height:40px;}
.submenu_2 > ul >li:hover > a{ color:#1eaffa}
.submenu_2 > ul > .end{ background: none}
#menu div{ display:none}
/*=============================================================================== sliders =====*/
#page1 .sliders {background: url(../images/sliders-bg.gif) 0 0 repeat-x #0e0e0e; overflow:none !important; height:398px; padding-bottom:2px; padding-top:10px}
.sliders {
background: url(../images/sliders-bg-1.gif) 0 0 repeat-x #0e0e0e;
border-radius: 0 0 20px 20px;
-moz-border-radius: 0 0 20px 20px;
-webkit-border-radius: 0 0 20px 20px;
box-shadow: 2px 1px 3px #101010;
-moz-box-shadow: 2px 1px 3px #101010;
-webkit-box-shadow: 2px 1px 3px #101010;
position: relative; padding-top:10px;
.slider{ overflow:none !important; z-index:2 !important; zoom:1}
.sliders .pic { margin: 0 0 10px 10px; position:relative; z-index:2 !important; zoom:1}
#page1 .sliders .pic { margin: 0 0 20px 10px;}
.sliders .items{ display:none}
.pagination{ position: relative; z-index:2; bottom:0px; left:376px; zoom:1}
* + html .pagination{ bottom:3px;}
.pagination li{ float:left; padding-right:6px;}
.pagination li a{ display:block; width:25px; height:25px; background:url(../images/buttons.png) right 0 no-repeat; text-indent:-9999px;}
.pagination li a:hover, .pagination .current a{ background-position:left}
/*======================================================================================== =========================== content =====*/
/*=============================================================================== indents =====*/
.indent { padding: 0px 0px 0px 0px }
.indent1 { padding: 0px 0px 0px 0px }
.policy-indent {padding: 0 30px 34px 0;}
.policy-indent a:hover {text-decoration: underline;}
/*=============================================================================== col-indents =====*/
.col-indent { padding-right: 0px; }
.col-indent1 { padding-right: 37px; }
.col-indent2 { padding-right: 29px; }
.col-indent3 { padding-right: 44px; }
.col-indent4 { padding-right: 36px; }
/*=============================================================================== boxes =====*/
.box {
background: #000;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
box-shadow: 5px 5px 5px #191919;
-moz-box-shadow: 5px 5px 5px #191919;
-webkit-box-shadow: 5px 5px 5px #191919;
position: relative;
padding: 0px 0px 0px 32px;
left: 2px;
top: 1px;
/*=============================================================================== line-hor =====*/
/*=============================================================================== lists =====*/
.list {
padding: 18px 0 0;
.list li {
background: url(../images/list-bg.gif) 2px 6px no-repeat;
padding-left: 14px;
.list li a {
color: #19a7f4;
font-weight: bold;
.list .last {padding-bottom: 12px;}
.list_1 {padding-bottom: 18px;}
.list_1 li {
font-size: 12px;
line-height: 24px;
.list_1 li a {
text-decoration: none;
color: #828282;
text-transform: uppercase;
.list_1 li a:hover {color: #19a7f4;}
/*=============================================================================== images =====*/
.images img {margin-bottom: 1px;}
/*=============================================================================== links =====*/
.link {
background: url(../images/link-bg.gif) 0 0 repeat-x #191818;
display: inline-block;
padding: 8px 13px 11px;
text-decoration: none;
border-radius: 9px;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
position: relative;
font-size: 14px;
line-height: 1.2em;
color: #fff;
margin-top: 9px;
.link:hover {
color: #19a7f4;
.links a {
display: block;
width: 107px;
height: 49px;
text-decoration: none;
.links .fleft {
background: url(../images/links-fleft.gif) 0 0 no-repeat;
.links .fleft:hover, .links .fright:hover{ background-position:bottom}
.links .fright {
background: url(../images/links-fright.gif) 0 0 no-repeat;
.policy-indent a {text-decoration: none; color: #19a7f4;}
/*=============================================================================== contact =====*/
.contact {
width: 195px;
float: left;
.contact span {
display: inline-block;
vertical-align: baseline;
width: 99px;
.contact a {
font-weight: bold;
text-decoration: none;
color: #19a7f4;
.contact a:hover {text-decoration: underline;}
/*======================================================================================== =========================== footer =====*/
footer {position: relative; overflow: hidden;}
footer .indent {padding: 31px 0 62px 31px;}
footer .col {
float: left;
width: 162px;
margin-right: 30px;
footer img {
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
box-shadow: 5px 5px 5px #1a1a1a;
-moz-box-shadow: 5px 5px 5px #1a1a1a;
-webkit-box-shadow: 5px 5px 5px #1a1a1a;
position: relative;
footer .divider1 {background:url(../images/divider_1-bg.gif) 574px 0px repeat-y;}
.policy {
position: absolute;
bottom: 0;
background: url(../images/policy-bg.gif) 0 0 repeat-x;
height: 36px;
width: 100%;
.policy strong {
padding: 14px 0 0 380px;
color: #333;
text-transform: uppercase;
text-decoration: none;
font-size: 12px;
line-height: 1.2em;
display: inline-block;
text-align: left;
.policy strong a {margin-right: 60px; color: #9f9f9f; text-decoration: none;}
.policy strong a:hover {
color: #333;
/*---------------------------------------------------------------------------------------- --------------------------- forms -----*/
#ContactForm {
padding-top: 21px;
width: 215px;
#ContactForm label {
min-height: 44px;
display: block;
position:relative;
background: url(../images/label-bg.gif) no-repeat 0 0;
#ContactForm .error,#ContactForm .empty{ position:relative; font-size:10px; color:#19A7F4; background:none; padding:0; display:none}
#ContactForm .link {
margin: 30px 0px 0px 0px;
padding: 8px 19px 11px;
#ContactForm input {
width: 193px;
border: none;
padding: 7px 11px;
background: none;
color: #828282;
font-size: 14px;
line-height: 18px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
#ContactForm textarea {
width: 194px;
height: 433px;
background: none;
border: none;
padding: 0px 11px;
color: #828282;
font-size: 14px;
line-height: 18px;
overflow: auto;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
#ContactForm span {
width: 215px;
display: block;
background: url(../images/text-bg.gif) no-repeat 0 0;
border: none;
padding: 6px 0px;
.success{ padding-bottom:15px; display:none}
.success strong{color:#19A7F4;}
/*==========================================*/
/* Project specifics =========================================================== */
/* Pour some CSS below ========================================================= */
Index-3.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Projects</title>
<meta charset="utf-8">
<link rel="stylesheet" href="css/reset.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/layout.css" type="text/css" media="screen">
<script type="text/javascript" src="js/html5.js"></script>
<script type="text/javascript" src="js/jquery-1.6.min.js" ></script>
<script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/cufon-replace.js"></script>
<script src="js/MyriadPro-Bold.js" type="text/javascript"></script>
<script src="js/Myriad_Roman.js" type="text/javascript"></script>
<script type="text/javascript" src="js/imagepreloader.js"></script>
<script type="text/javascript">
preloadImages([
'images/nav-a-bg-hover.gif',
'images/nav-last-a-bg-hover.gif',
'images/nav-first-a-bg-hover.gif.jpg']);
</script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/tms-0.3.js"></script>
<script type="text/javascript" src="js/tms_presets.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<script src="js/jcarousellite.js" type="text/javascript"></script>
<script type="text/javascript" src="js/superfish.js"></script>
<!--[if lt IE 7]>
<script type="text/javascript" src="http://info.template-help.com/files/ie6_warning/ie6_script_other.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<style type="text/css">
.menu_box > li > a, .sliders, .box, .link, footer img{ behavior: url(js/PIE.htc); }
</style>
<![endif]-->
</head>
<body id="page4">
<div class="extra"><div class="shadow">
<div class="main">
<!-- header -->
<header>
<div class="container header">
<strong>We provide quality manufacturing!</strong>
<div class="login">
<div class="social">
<a href="#"><img src="images/social-img_3.gif" alt="" /></a><a href="#"><img src="images/social-img_2.gif" alt="" /></a><a href="#"><img src="images/social-img_1.gif" alt="" /></a>
</div>
<a href="#" class="login-link">Client Login</a>
</div>
<div class="clear"></div>
</div>
<div class="wrapper"><h1><a href="index.html">Highway Road Construction and repair</a></h1></div>
<nav>
<ul id="menu">
<li class="first"><a href="index.html">Home</a></li>
<li><a href="index-1.html">powder coating</a>
<!--<div class="submenu_1">
<ul class="menu_box">
<li><a href="index-1.html">Earthwork Contractor</a></li>
<li><a href="index-1.html">Utility Contractor</a></li>
<li><a href="index-1.html">Demolition Contractor</a>
<div class="submenu_2">
<ul>
<li><a href="index-1.html">Demolish</a></li>
<li class="end"><a href="index-1.html">recycle </a></li>
</ul>
</div>
</li>
<li><a href="index-1.html">Road Construction</a></li>
<li class="end"><a href="index-1.html">Construction Equipment Rental</a></li>
</ul>
</div>
</li>-->
<li><a href="index-2.html">fabrication</a></li>
<li><a href="index-3.html" class="active">projects</a></li>
<li><a href="index-4.html">design</a></li>
<li><a href="index-5.html">wire forming</a></li>
<li class="last"><a href="index-6.html">contact us</a></li>
</ul>
</nav>
<div class="sliders">
<ul class="items">
<li><img src="images/red_bike.gif" alt=""></li>
<li><img src="images/well.gif" alt=""></li>
<li><img src="images/belle_inn.gif" alt=""></li>
<li><img src="images/belle_motive.gif" alt=""></li>
<li><img src="images/basin_cab.gif" alt=""></li>
<li><img src="images/basin_bed.gif" alt=""></li>
</ul>
</div>
</header>
<!-- content -->
<section id="content">
<div class="box">
<div class="wrapper divider">
<article class="col-1 col-indent bot">
<div align="center">
<h2>Best Projects</h2>
<p class="bot"><strong class="color">Maecenas tristique orci ac sem. Duis ultricies pharetra donec in accumsan malesuada orci orem ipsum dolor sit amet.</strong></p></div>
<div class="images">
<ul>
<li><a href="#"><img src="images/yellow.gif" alt="" width="215" height="124"/></a></li>
<li><a href="#"><img src="images/basin_door.gif" alt="" width="215" height="124"/></a></li>
<li><a href="#"><img src="images/ford_valve_covers.gif" alt="" width="215" height="124"/></a></li>
<li><a href="#"><img src="images/car_frame.gif" alt="" width="215" height="124"/></a></li>
</ul>
</div>
<div class="wrapper links">
<a href="#" class="fleft" id="prev"> </a>
<a href="#" class="fright" id="next"> </a>
</div>
</article>
<article class="col-2 bot1">
<div align="center">
<h2>Past Projects</h2>
<p>For 25 years, Manufacturing Systems Inc. has had the opportunity to send a wide variety of products out the door and are always excited to be involved in new, innovative projects.<br>
<br>
Our signature product line, <a href="http://www.trucatchtraps.com" title="Tru Catch Traps" target="_blank">Tru-Catch Traps™</a>, has allowed us to serve the animal welfare community nation-wide and gain valuable knowledge in every aspect of product development, design, promotion,a nd sales. Our traps are constructed, welded, and powder coated in-house. Give your customers what we give ours...a quality, American-made product. </p>
</div>
<div class="wrapper top">
<div class="col-1 col-indent3">
<ul class="list">
<li><a href="#">Vestibulum iaculis lacinia est roin</a></li>
<li><a href="#">Fusce euismod consequat ante ing elitom</a></li>
<li><a href="#">Lorem ipsum dolor sit amet consecte</a></li>
<li><a href="#">Aliquam congue fermentum nisl</a></li>
<li><a href="#">Mauris accumsan nulla vel diam ulla venen</a></li>
<li><a href="#">Sed in lacus ut enim adipiscing aliquet</a></li>
<li><a href="#">In pede mi aliquet sit amet euism</a></li>
<li><a href="#">Praesent justo dolor lobortis quis lobortis</a></li>
</ul>
</div>
<div class="col-1">
<ul class="list">
<li><a href="#">Sed in lacus ut enim adipiscing aliquet</a></li>
<li><a href="#">In pede mi aliquet sit amet euism</a></li>
<li><a href="#">Praesent justo dolor lobortis quis lobortis</a></li>
<li><a href="#">Vestibulum sed ante onec sagittis</a></li>
<li><a href="#">Fusce euismod consequat ante ing elitom</a></li>
<li><a href="#">Lorem ipsum dolor sit amet consecte</a></li>
<li><a href="#">Aliquam congue fermentum nisl</a></li>
<li><a href="#">Mauris accumsan nulla vel diam ulla venen</a></li>
</ul>
</div>
</div>
<!--<p class="top3"><a href="#" class="link">More Info</a></p>-->
<div align="center">
<h2>Current Projects</h2>
<p><strong class="color">Project1. </strong> Fusce euismod consequat ante. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque sed dolor. Aliquam congue fermentum nisl. Mauris accumsan nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in, auctor ut in, ligula. Aliquam dapibus tincidunt metus justo dolor.</p>
<p><strong class="color">Project2. </strong> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque sed dolor. Aliquam congue fermentum nisl. Mauris accumsan nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in, auctor ut in, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Donec sagittis euismod purus euismod.</p>
<!--<p><a href="#" class="link">More Info</a></p>-->
</div>
</article>
</div>
</div>
</section>
</div>
<!-- footer -->
<footer>
<div class="main">
<div class="indent">
<div class="container divider1">
<div class="col">
<div align="center">
<h3>Subnavigation</h3>
</div>
<ul class="list_1">
<li><a href="#">Clients Support</a></li>
<li><a href="#">Standards</a></li>
<li><a href="#">new technologies</a></li>
<li><a href="#">faqs</a></li>
</ul>
</div>
<div class="col">
<div align="center">
<h3>Archive</h3>
</div>
<ul class="list_1">
<li><a href="#">2012</a></li>
<li><a href="#">2011</a></li>
<li><a href="#">2010</a></li>
<li><a href="#">2009</a></li>
</ul>
</div>
<div class="col col-indent2">
<div align="center">
<h3>Useful Info</h3>
</div>
<ul class="list_1">
<li><a href="#">news</a></li>
<li><a href="#">career</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">hours: mon-fri 8-5 MST</a></li>
</ul>
</div>
<div class="fleft">
<img src="images/footer-img.jpg" alt="" / -
How do I create a scrolling slideshow in iMovie?
So I know how to make a basic slideshow in iMovie, but I'd like to create a "scrolling/sliding" slideshow (see link: http://www.youtube.com/watch?v=CXit8kxCCTg). That video uses videos, however, I'm using still pictures. The pictures can all just be side by side too, they don't have to stack like one on top of the other (I'll edit all my photos before hand to make them the same height). I'm using iMovie '11. I'll probably have 150-300 pictures all together. I'd also love to add a timeline to the bottom of the pictures to scroll with the pictures...should I just add that in to each individual picture before hand, and then put it all into iMovie, or can I do it all in iMovie? Also, towards the end of that youtube video, it all starts scrolling backwards....is there a way to do this???
Basically, I'd like to create a scrolling picture timeline with continuous text scrolling across the bottom that I can also play in reverse. Is this even possible in iMovie? Any help with this would be GREATLY appreciated. This is time sensitive. I really need to know how to do this by Friday. THANKS!!!!!I agree with John that you could do this in Final Cut Pro X and Motion, but there is probably a plugin that you can purchase that would do the hard work in Motion for you.
I think it might be technically possible to do this in Motion and export out in a file that iMovie can import, but in the video example, there is a lot more going on such as multicam syncing that would require Final Cut Pro X. Motion's strength is not to use it as a video editor. It is best used as a way to create a special effect that you can then use in a FCPX project. (just my opinion)
Here are some example of FCPX plugins. There are hundreds more.
http://www.fcp.co/final-cut-pro/news/1065-animated-panel-transitions-with-the-pa nel-pop-plugin-for-final-cut-pro-x
http://www.fcp.co/final-cut-pro/news/1011-pixel-film-studios-release-final-cut-p ro-x-plugin-proslice-for-split-screen-work -
Dynamic Scrolling of MovieClip
Hi everyone,
I have an application in which i am making a dynamic photo
gallery. I have made a scroller movieClip "thumbs_mc". Now i want
to make it scroll. for that i created 2 movieClips ,left and right.
and wrote some code. but its not working.
1st depth is the main picture's movieClip's depth, 2nd depth
is thumbs_mc, 3rd is mask movieClip. 4th and 5th are for left and
right. Also, I am creating movieClips within Thumbs_mc for holding
thumbnails.
and two buttons leftScroll and rightScroll.
can anyone tell me, why is it not working?, how should i
modify it..
waiting for someone to throw some good light on this peice..
Thankshere are my files, Please have a look at them..I want to make
the thumbnail movieclip scrolling...
[deleted]
I want to make the thumbnail movieclip scrolling...
Thanks alot -
Dynamic scroll bar not visible
I created my text in a text file (saved as testtext.txt),
then in Flash I added a dynamic text box (instance name: testtext)
and dragged a scrollbar component (instance name: ttscroll) onto
it. I then added this action script to the first frame:
ttscroll._visible = (testtext.maxscroll >1);
loadVariables("testtext.txt", this);
The text shows up fine, and scrolls if I put my mouse in the
text box and drag down. However, the scroll bar doesn't show up.
How do I get this to work?
Thanks.
PS Due to company policies I'm not allowed to download and
install anything, so I have to stick with what comes with Flash, so
please don't recommend I download someone else's scrollbar.My first guess is that you are testing for maxScroll before
the text is
actually loaded, so the test result is false.
You could use a listener for the loading function and let the
listener's
onLoadInit() event set the scrollbar.
Another option is to use a textArea component. It has an
automatic
scrollbar.
Rob
Rob Dillon
Adobe Community Expert
http://www.ddg-designs.com
412.243.9119 -
HTML Article put together dynamically, scroll only possible after orientation change
Hi guys,
i have encountered the following problem today:
im having a HTML page put together dynamically from a JSON source file, handling the JSON information with jQuery. i am uploading said HTML page (html page is empty until the page is in the DPS stack, then it builds itself) as an HTML article with "Smooth Scrolling: Vertical". So far, so good.
When i open the page inside the Adobe Viewer App on my iPad, i can see the "first" part of the page (the first 1024px in portrait-orientation) but i am not able to scroll further down the page.
however, when i do a orientation change of the device (turn it landscape and then back), i can scroll perfectly fine and am able to see everything on the page (so im quite sure the conversion from json to jquery to html does work). even stranger, when i let the page tell me its height ( via $("body").height() and $(document).height() ) it shows me, that the height of the page is indeed (e.g.) 10.000px, but i am not able to scroll down until i do the orientation change.
am i missing something? im pretty sure that my code is correct, because once i change the orientation of my device, everything does work flawless.
i hope my problem is understandable, any help is much appreciated.
thanks
MaxNevermind... since the HTML is empty, when the magazin gets opened, i suspect the HTML tells DPS "hey, my height is 0px, dont bother scrolling!". but once i am on the page itself and the process of bulding the page starts (HTML elements are added on the fly), it doesnt tell DPS "hey, my height changed, check if i need to be scrollable please" since im not able to scroll. when im changing orientation, it forces DPS to rerender the page and thus getting the correct height of the page.
my workaround: setting the body height to (e.g.) 20.000px and then, later on, reduce it to the actual height needed by the HTML elements.
but still: can someone explain me the process of loading / rendering pages inside DPS? when do DPS render pages, does it render pages the first time i open the app and then again when im on the page itself (or rather a page before the actual page?) is there a command to force DPS to rerender the page? -
Need dynamic scroller mc to work in main timeline
I have a dynamic image scroller that scrolls right or left following where the mouse is. When you hover over the images, a pop-up box also appears with information.
This scroller works perfectly fine within the mc scene, but once i drag the mc into the main timeline the mc doesn't smoothly scroll right or left. It's jumpy and the infobox doesn't work at all.
How can I get it to work smoothly on the main timeline?the first problem i see is you're repeatedly executing that onMouseMove. use:
//roll over is equal to the function
panel.onRollOver = panelOver;
//when it enters the box, it makes the "scrollPanel" function work
function panelOver() {
this.onEnterFrame = scrollPanel;
delete this.onRollOver;
var b = stroke.getBounds (this);
//makes the panel scroll with the mouse
function scrollPanel () {
if(_xmouse<b.xMin || _xmouse>b.xMax || _ymouse<b.yMin || _ymouse>b.yMax) {
this.onRollOver = panelOver;
delete this.onEnterFrame;
if(panel._x <= -707.8) {
panel._x = -707.8;
if(panel._x >= 332.4) {
panel._x = 332.4;
var xdist = _xmouse - 275;
panel._x += -xdist / 7;
//tip box is set to invisible to not be seen
infobox_mc._visible = false;
var tipInt;
//when rollover on button, tip box will say "blank"
panel.pic1_btn.onRollOver = function () {
mmF();
tipInt = setInterval(showTip, 100, "Piece 1");
panel.pic1_btn.onRollOut = function() {
hideTip();
panel.pic4_btn.onRollOver = function () {
tipInt = setInterval(showTip, 100, "Piece 2");
panel.pic4_btn.onRollOut = function() {
hideTip();
//counts the time that the mouse is over the button
var count = 0;
//clears the text in the textbox and makes the box follow the mouse, and if the count is at 3 then, it appears, otherwise, it adds "1"
function showTip(tiptext) {
if(count == 3) {
clearInterval(tipInt);
count = 0;
infobox_mc.tiptext.text = tiptext;
infobox_mc._x = _root._xmouse+this._x;
infobox_mc._y = _root._ymouse+this._y;
infobox_mc._visible = true;
else {
count++;
function mmF(){
this.onMouseMove = function() {
infobox_mc._x = _root._xmouse+this._x;
infobox_mc._y = _root._ymouse+this._y;
//hides the box when rolled off the button
function hideTip() {
clearInterval(tipInt);
infobox_mc._visible = false;
delete this.onMouseMove; -
Dynamically resizing slideshow with ken burns needed
Hi,
does anyone here know a free or commercial slideshow component for AS3 (must work with flex 3) which does the following:
cross-fading,
ken burns zooming and panning with per image definition (eg. with xml file)
scale-to-fill resizing of images
dynamically resizable frame size (so it can be used as a browser background)
It should work like on the following site
http://www.timhupe.com/
My client wants this, but programming it from scratch will take rather long, so if anyone can help out here, that would be great.
thanks
jqChris:
The export method you used creates a 640 x 480 QT file. If you use the Share->Send to iDVD menu option that will create a 720 x 540 QT file, save it in the Movies folder and automatically put it in iDVD. That should produce a higher image quality final product. If you have an iDVD project already started open it before starting the Share procedure so it will be the selected destination. In any case the larger QT movie will be saved to your Movies folder so you can include it manually is desired.
Do you Twango?
TIP: For insurance against the iPhoto database corruption that many users have experienced I recommend making a backup copy of the Library6.iPhoto database file and keep it current. If problems crop up where iPhoto suddenly can't see any photos or thinks there are no photos in the library, replacing the working Library6.iPhoto file with the backup will often get the library back. By keeping it current I mean backup after each import and/or any serious editing or work on books, slideshows, calendars, cards, etc. That insures that if a problem pops up and you do need to replace the database file, you'll retain all those efforts. It doesn't take long to make the backup and it's good insurance.
G5 Dual Core 2GHz, 2G RAM, 250G HD; G4 Dual 1Ghz, 1.5G RAM, 80G HD, Mac OS X (10.4.7) 22 LCD Display, 200G & 160G FW HDs, Canon S400, i850 & LIDE 50, Epson R200 -
Puting images into dynamic scrolling text
So I have a dynamic text box and it is linked to the UI
Scroll component. How do I put images in so that the image scrolls
with the text?What i find works is to import the the text into a dynamic
text field in flash. I use notepad to write the HTML (which is to
be loaded externally) and use this HTML to bring in the images,
this way they all scroll with the text in the dynamic text box. So
you could use the <img src> tag in the external text (in
notepad) then import the text into flash using LoadVars() into the
frame where you want the text.
I've used this countless time for sites and stuff although im
having problems getting the text nest into a movie clip (im about
to post for help on that one .....
Not sure how clear all that is to you...... -
How do I create dynamic scrolling text in Flash CS5?
Hi everyone,
I am a complete newbie to Flash. I'm tyring to build a scrolling text box that automatically scrolls. On mouse over, I want the scrolling to stop so users can click on an item in the text box. All of the items will be tied to external hyperlinks. I want to populate the text box with an external file. I've done some searches on Adobe, but haven't found anything that takes me through the whole process.
I have the complete Adobe Master Collection. So if this is easier in Flash Catalyst, let me know. I know how to buid a manual scroll box in Flash Catalyst. Could I export this to and add the auto-scrolling?
Remember, I'm a complete newbie.
Any help will be greatly appreciated.
Thanks!Thanks again Kglad,
I really have no preference of Action Script since I don't have any significant experience with either one.
I'll keep doing searches to see if I can get the information I need.
Have a great holiday.
Maybe you are looking for
-
Configure SSO for ITS to R/3 using SNC/Kerberos
Our R/3 systems had been configured for SSO using SNC and Kerberos for awhile now. We now have a requirement to configure SSO between ITS and R/3. Since our R/3 env. has been using kerberos library, we won't be able to use SAP Cryptographic library
-
If I open the bookmark's sidebar it's empty. If I use the Menu Bar, the bookmarks are all there. I tried importing them from Internet Explorer but they still do not show up on the sidebar. I also tried restoring but they still don't show in the sideb
-
Tax conditions in purchase register report
Hi all, I am developing a Purchase Register Report, I have a small doubt regarding Tax conditions. From which tables we will get the Tax Conditions like CST, SERVICE TAX, VAT etc. Previously I have developed Purchase Requisition Report,in that I have
-
Hi, Created the capital Purchase Order and want to know how to capture the Freight charges, Clearing and Forwarding charges and Customs Charges against this Purchase Order. Regards,
-
Ok, so anyone who has worked with Flash's built-in radio button knows that it's not very friendly when trying to make multi-line labels. Once you know where to look and what properties to change it's not much of a problem...BUT... I can't get the dar